feat: improve profile UI/UX and migrate to Mantine modals
This commit is contained in:
@@ -7,14 +7,12 @@
|
||||
/** biome-ignore-all lint/style/noNonNullAssertion: <explanation */
|
||||
/** biome-ignore-all lint/suspicious/noAssignInExpressions: <explanation */
|
||||
|
||||
import { MantineProvider } from "@mantine/core";
|
||||
import { RouterProvider } from "@tanstack/react-router";
|
||||
import { createTheme, MantineProvider } from "@mantine/core";
|
||||
import { createRouter, RouterProvider } from "@tanstack/react-router";
|
||||
import { Inspector } from "react-dev-inspector";
|
||||
import { createRoot } from "react-dom/client";
|
||||
import { createTheme } from "@mantine/core";
|
||||
|
||||
import { createRouter } from "@tanstack/react-router";
|
||||
import { routeTree } from "./routeTree.gen";
|
||||
import { ModalsProvider } from "@mantine/modals";
|
||||
|
||||
// Create a new router instance
|
||||
export const router = createRouter({
|
||||
@@ -29,45 +27,46 @@ declare module "@tanstack/react-router" {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const theme = createTheme({
|
||||
/** Theme customization here */
|
||||
/** Theme customization here */
|
||||
});
|
||||
|
||||
const InspectorWrapper = import.meta.env.DEV
|
||||
? Inspector
|
||||
: ({ children }: { children: React.ReactNode }) => <>{children}</>;
|
||||
? Inspector
|
||||
: ({ children }: { children: React.ReactNode }) => <>{children}</>;
|
||||
|
||||
const elem = document.getElementById("root")!;
|
||||
const app = (
|
||||
<InspectorWrapper
|
||||
keys={["shift", "a"]}
|
||||
onClickElement={(e) => {
|
||||
if (!e.codeInfo) return;
|
||||
<InspectorWrapper
|
||||
keys={["shift", "a"]}
|
||||
onClickElement={(e) => {
|
||||
if (!e.codeInfo) return;
|
||||
|
||||
const url = import.meta.env.VITE_PUBLIC_URL;
|
||||
fetch(`${url}/__open-in-editor`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
relativePath: e.codeInfo.relativePath,
|
||||
lineNumber: e.codeInfo.lineNumber,
|
||||
columnNumber: e.codeInfo.columnNumber,
|
||||
}),
|
||||
});
|
||||
}}
|
||||
>
|
||||
<MantineProvider theme={theme}>
|
||||
<RouterProvider router={router} />
|
||||
</MantineProvider>
|
||||
</InspectorWrapper>
|
||||
const url = import.meta.env.VITE_PUBLIC_URL;
|
||||
fetch(`${url}/__open-in-editor`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
relativePath: e.codeInfo.relativePath,
|
||||
lineNumber: e.codeInfo.lineNumber,
|
||||
columnNumber: e.codeInfo.columnNumber,
|
||||
}),
|
||||
});
|
||||
}}
|
||||
>
|
||||
<MantineProvider theme={theme}>
|
||||
<ModalsProvider>
|
||||
<RouterProvider router={router} />
|
||||
</ModalsProvider>
|
||||
</MantineProvider>
|
||||
</InspectorWrapper>
|
||||
);
|
||||
|
||||
if (import.meta.hot) {
|
||||
// With hot module reloading, `import.meta.hot.data` is persisted.
|
||||
const root = (import.meta.hot.data.root ??= createRoot(elem));
|
||||
root.render(app);
|
||||
// With hot module reloading, `import.meta.hot.data` is persisted.
|
||||
const root = (import.meta.hot.data.root ??= createRoot(elem));
|
||||
root.render(app);
|
||||
} else {
|
||||
// The hot module reloading API is not available in production.
|
||||
createRoot(elem).render(app);
|
||||
// The hot module reloading API is not available in production.
|
||||
createRoot(elem).render(app);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user