Untitled

 avatar
unknown
tsx
2 years ago
4.8 kB
10
Indexable
import { Refine } from "@refinedev/core";

import {
    DarkTheme,
    LightTheme,
    notificationProvider,
    WelcomePage,
} from "@refinedev/mantine";

import {
    ColorScheme,
    ColorSchemeProvider,
    Global,
    MantineProvider,
} from "@mantine/core";
import { useLocalStorage } from "@mantine/hooks";
import { NotificationsProvider } from "@mantine/notifications";
import routerBindings, {
    UnsavedChangesNotifier,
} from "@refinedev/react-router-v6";
import dataProvider from "@refinedev/simple-rest";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import { MantineInferencer } from "@refinedev/inferencer/mantine";

import { UserList } from "pages/users/list";

function App() {
    const [colorScheme, setColorScheme] = useLocalStorage<ColorScheme>({
        key: "mantine-color-scheme",
        defaultValue: "light",
        getInitialValueInEffect: true,
    });

    const toggleColorScheme = (value?: ColorScheme) =>
        setColorScheme(value || (colorScheme === "dark" ? "light" : "dark"));

        // const API_URL = "https://api.fake-rest.refine.dev";
        const API_URL = "https://rickandmortyapi.com/api";

    return (
        <BrowserRouter>
            <ColorSchemeProvider
                colorScheme={colorScheme}
                toggleColorScheme={toggleColorScheme}
            >
                <MantineProvider
                    theme={colorScheme === "dark" ? DarkTheme : LightTheme}
                    withNormalizeCSS
                    withGlobalStyles
                >
                    <Global styles={{ body: { WebkitFontSmoothing: "auto" } }} />
                    <NotificationsProvider position="top-right">
                        <Refine
                            dataProvider={dataProvider(API_URL)}
                            notificationProvider={notificationProvider}
                            routerProvider={routerBindings}
                            resources={[
                                // {
                                //     name: "users",
                                //     list: "/users",
                                //     show: "/users/show/:id",
                                //     create: "/users/create",
                                //     edit: "/users/edit/:id",
                                // },
                                // {
                                //     name: "languages",
                                //     list: "/languages",
                                //     show: "/languages/show/:id",
                                //     create: "/languages/create",
                                //     edit: "/languages/edit/:id",
                                // },
                                {
                                    name: "character",
                                    list: "/character",
                                    show: "/character/show/:id",
                                },
                            ]}
                            options={{
                                syncWithLocation: true,
                                warnWhenUnsavedChanges: true,
                            }}
                        >
                            <Routes>
                                {/* <Route path="users">
                                    <Route index element={<UserList />} />
                                    <Route path="show/:id" element={<MantineInferencer />} />
                                    <Route path="edit/:id" element={<MantineInferencer />} />
                                    <Route path="create" element={<MantineInferencer />} />
                                </Route>
                                <Route path="languages">
                                    <Route index element={<MantineInferencer />} />
                                    <Route path="show/:id" element={<MantineInferencer />} />
                                    <Route path="edit/:id" element={<MantineInferencer />} />
                                    <Route path="create" element={<MantineInferencer />} />
                                </Route> */}
                                <Route path="character">
                                    <Route index element={<MantineInferencer />} />
                                    <Route path="show/:id" element={<MantineInferencer />} />
                                </Route>
                            </Routes>
                            <UnsavedChangesNotifier />
                        </Refine>
                    </NotificationsProvider>
                </MantineProvider>
            </ColorSchemeProvider>

        </BrowserRouter>
    );
}

export default App;