app/javascript/packs/rails-mini-profiler.js
import "../stylesheets/rails-mini-profiler.scss";
import tippy from "tippy.js";
import "tippy.js/dist/tippy.css";
import { Application } from "@hotwired/stimulus";
import { Dropdown } from "tailwindcss-stimulus-components";
import Checklist from "../js/checklist_controller";
import Selectable from "../js/select_controller";
import Filter from "../js/filter_controller";
import Search from "../js/search_controller";
import Enable from "../js/enable_controller";
import Clipboard from "../js/clipboard_controller";
const application = Application.start();
application.register("dropdown", Dropdown);
application.register("checklist", Checklist);
application.register("selectable", Selectable);
application.register("filters", Filter);
application.register("search", Search);
application.register("enable", Enable);
application.register("clipboard", Clipboard);
function setupTraceSearch() {
const traceNameSearch = document.getElementById("trace-search");
if (traceNameSearch) {
traceNameSearch.addEventListener("keyup", function (event) {
if (event.key === "Enter") {
event.preventDefault();
document.getElementById("trace-form").submit();
}
});
}
}
function setupRequestTable() {
const profiledRequestTable = document.getElementById(
"profiled-requests-table"
);
if (profiledRequestTable) {
const rows = profiledRequestTable.rows;
for (let i = 1; i < rows.length; i++) {
const currentRow = profiledRequestTable.rows[i];
const link = currentRow.dataset.link;
const createClickHandler = function () {
return function () {
window.location.href = link;
};
};
if (link) {
currentRow.onclick = createClickHandler(currentRow);
}
}
}
}
function setupTraceBars() {
const traceBars = document.querySelectorAll(".trace-bar");
traceBars.forEach((bar) => {
const popover = bar.children[0];
tippy(bar, {
trigger: "click",
content: popover,
theme: "rmp",
maxWidth: "700px",
placement: "bottom",
interactive: true,
onShow(instance) {
instance.popper
.querySelector(".popover-close")
.addEventListener("click", () => {
instance.hide();
});
},
onHide(instance) {
instance.popper
.querySelector(".popover-close")
.removeEventListener("click", () => {
instance.hide();
});
},
});
});
}
// Trace Bar Popovers
document.addEventListener(
"DOMContentLoaded",
() => {
setupRequestTable();
setupTraceBars();
setupTraceSearch();
},
false
);