diff --git a/src/App.tsx b/src/App.tsx index 265fc7d..1b63326 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,48 +1,22 @@ -import { - Refine, - GitHubBanner, - WelcomePage, - Authenticated, -} from "@refinedev/core"; -import { DevtoolsPanel, DevtoolsProvider } from "@refinedev/devtools"; -import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar"; +import {Refine, GitHubBanner, WelcomePage, Authenticated} from '@refinedev/core' +import {DevtoolsPanel, DevtoolsProvider} from '@refinedev/devtools' +import {RefineKbar, RefineKbarProvider} from '@refinedev/kbar' -import { - AuthPage, - ErrorComponent, - useNotificationProvider, - RefineSnackbarProvider, - ThemedLayoutV2, -} from "@refinedev/mui"; +import {AuthPage, ErrorComponent, useNotificationProvider, RefineSnackbarProvider, ThemedLayoutV2} from '@refinedev/mui' -import dataProvider from "@refinedev/simple-rest"; -import CssBaseline from "@mui/material/CssBaseline"; -import GlobalStyles from "@mui/material/GlobalStyles"; -import { BrowserRouter, Route, Routes, Outlet } from "react-router"; -import routerBindings, { - NavigateToResource, - CatchAllNavigate, - UnsavedChangesNotifier, - DocumentTitleHandler, -} from "@refinedev/react-router"; -import { - BlogPostList, - BlogPostCreate, - BlogPostEdit, - BlogPostShow, -} from "./pages/blog-posts"; -import { - CategoryList, - CategoryCreate, - CategoryEdit, - CategoryShow, -} from "./pages/categories"; -import { ColorModeContextProvider } from "./contexts/color-mode"; -import { Header } from "./components/header"; -import { Login } from "./pages/login"; -import { Register } from "./pages/register"; -import { ForgotPassword } from "./pages/forgotPassword"; -import { authProvider } from "./authProvider"; +import dataProvider from '@refinedev/simple-rest' +import CssBaseline from '@mui/material/CssBaseline' +import GlobalStyles from '@mui/material/GlobalStyles' +import {BrowserRouter, Route, Routes, Outlet} from 'react-router' +import routerBindings, {NavigateToResource, CatchAllNavigate, UnsavedChangesNotifier, DocumentTitleHandler} from '@refinedev/react-router' +import {BlogPostList, BlogPostCreate, BlogPostEdit, BlogPostShow} from './pages/blog-posts' +import {CategoryList, CategoryCreate, CategoryEdit, CategoryShow} from './pages/categories' +import {ColorModeContextProvider} from './contexts/color-mode' +import {Header} from './components/header' +import {Login} from './pages/login' +import {Register} from './pages/register' +import {ForgotPassword} from './pages/forgotPassword' +import {authProvider} from './authProvider' function App() { return ( @@ -51,31 +25,31 @@ function App() { - + } - > + }> } > - } - /> + } /> } /> } /> @@ -121,20 +89,14 @@ function App() { } - > + }> } > } /> } /> - } - /> + } /> @@ -148,7 +110,7 @@ function App() { - ); + ) } -export default App; +export default App diff --git a/src/authProvider.ts b/src/authProvider.ts index d31a28d..d6e3cfa 100644 --- a/src/authProvider.ts +++ b/src/authProvider.ts @@ -1,59 +1,59 @@ -import type { AuthProvider } from "@refinedev/core"; +import type {AuthProvider} from '@refinedev/core' -export const TOKEN_KEY = "refine-auth"; +export const TOKEN_KEY = 'refine-auth' export const authProvider: AuthProvider = { - login: async ({ username, email, password }) => { + login: async ({username, email, password}) => { if ((username || email) && password) { - localStorage.setItem(TOKEN_KEY, username); + localStorage.setItem(TOKEN_KEY, username) return { success: true, - redirectTo: "/", - }; + redirectTo: '/', + } } return { success: false, error: { - name: "LoginError", - message: "Invalid username or password", + name: 'LoginError', + message: 'Invalid username or password', }, - }; + } }, logout: async () => { - localStorage.removeItem(TOKEN_KEY); + localStorage.removeItem(TOKEN_KEY) return { success: true, - redirectTo: "/login", - }; + redirectTo: '/login', + } }, check: async () => { - const token = localStorage.getItem(TOKEN_KEY); + const token = localStorage.getItem(TOKEN_KEY) if (token) { return { authenticated: true, - }; + } } return { authenticated: false, - redirectTo: "/login", - }; + redirectTo: '/login', + } }, getPermissions: async () => null, getIdentity: async () => { - const token = localStorage.getItem(TOKEN_KEY); + const token = localStorage.getItem(TOKEN_KEY) if (token) { return { id: 1, - name: "John Doe", - avatar: "https://i.pravatar.cc/300", - }; + name: 'John Doe', + avatar: 'https://i.pravatar.cc/300', + } } - return null; + return null }, onError: async (error) => { - console.error(error); - return { error }; + console.error(error) + return {error} }, -}; +} diff --git a/src/components/header/index.tsx b/src/components/header/index.tsx index 0a2bd9a..0491678 100644 --- a/src/components/header/index.tsx +++ b/src/components/header/index.tsx @@ -1,67 +1,50 @@ -import DarkModeOutlined from "@mui/icons-material/DarkModeOutlined"; -import LightModeOutlined from "@mui/icons-material/LightModeOutlined"; -import AppBar from "@mui/material/AppBar"; -import Avatar from "@mui/material/Avatar"; -import IconButton from "@mui/material/IconButton"; -import Stack from "@mui/material/Stack"; -import Toolbar from "@mui/material/Toolbar"; -import Typography from "@mui/material/Typography"; -import { useGetIdentity } from "@refinedev/core"; -import { HamburgerMenu, RefineThemedLayoutV2HeaderProps } from "@refinedev/mui"; -import React, { useContext } from "react"; -import { ColorModeContext } from "../../contexts/color-mode"; +import DarkModeOutlined from '@mui/icons-material/DarkModeOutlined' +import LightModeOutlined from '@mui/icons-material/LightModeOutlined' +import AppBar from '@mui/material/AppBar' +import Avatar from '@mui/material/Avatar' +import IconButton from '@mui/material/IconButton' +import Stack from '@mui/material/Stack' +import Toolbar from '@mui/material/Toolbar' +import Typography from '@mui/material/Typography' +import {useGetIdentity} from '@refinedev/core' +import {HamburgerMenu, RefineThemedLayoutV2HeaderProps} from '@refinedev/mui' +import React, {useContext} from 'react' +import {ColorModeContext} from '../../contexts/color-mode' type IUser = { - id: number; - name: string; - avatar: string; -}; + id: number + name: string + avatar: string +} -export const Header: React.FC = ({ - sticky = true, -}) => { - const { mode, setMode } = useContext(ColorModeContext); +export const Header: React.FC = ({sticky = true}) => { + const {mode, setMode} = useContext(ColorModeContext) - const { data: user } = useGetIdentity(); + const {data: user} = useGetIdentity() return ( - + - + - + { - setMode(); + setMode() }} > - {mode === "dark" ? : } + {mode === 'dark' ? : } {(user?.avatar || user?.name) && ( - + {user?.name && ( = ({ - ); -}; + ) +} diff --git a/src/components/index.ts b/src/components/index.ts index 924cc88..7c8ead2 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -1 +1 @@ -export { Header } from "./header"; +export {Header} from './header' diff --git a/src/contexts/color-mode/index.tsx b/src/contexts/color-mode/index.tsx index 79b3e75..f7c4c21 100644 --- a/src/contexts/color-mode/index.tsx +++ b/src/contexts/color-mode/index.tsx @@ -1,45 +1,32 @@ -import React, { - PropsWithChildren, - createContext, - useEffect, - useState, -} from "react"; -import { ThemeProvider } from "@mui/material/styles"; -import { RefineThemes } from "@refinedev/mui"; +import React, {PropsWithChildren, createContext, useEffect, useState} from 'react' +import {ThemeProvider} from '@mui/material/styles' +import {RefineThemes} from '@refinedev/mui' type ColorModeContextType = { - mode: string; - setMode: () => void; -}; + mode: string + setMode: () => void +} -export const ColorModeContext = createContext( - {} as ColorModeContextType -); +export const ColorModeContext = createContext({} as ColorModeContextType) -export const ColorModeContextProvider: React.FC = ({ - children, -}) => { - const colorModeFromLocalStorage = localStorage.getItem("colorMode"); - const isSystemPreferenceDark = window?.matchMedia( - "(prefers-color-scheme: dark)" - ).matches; +export const ColorModeContextProvider: React.FC = ({children}) => { + const colorModeFromLocalStorage = localStorage.getItem('colorMode') + const isSystemPreferenceDark = window?.matchMedia('(prefers-color-scheme: dark)').matches - const systemPreference = isSystemPreferenceDark ? "dark" : "light"; - const [mode, setMode] = useState( - colorModeFromLocalStorage || systemPreference - ); + const systemPreference = isSystemPreferenceDark ? 'dark' : 'light' + const [mode, setMode] = useState(colorModeFromLocalStorage || systemPreference) useEffect(() => { - window.localStorage.setItem("colorMode", mode); - }, [mode]); + window.localStorage.setItem('colorMode', mode) + }, [mode]) const setColorMode = () => { - if (mode === "light") { - setMode("dark"); + if (mode === 'light') { + setMode('dark') } else { - setMode("light"); + setMode('light') } - }; + } return ( = ({ > {children} - ); -}; + ) +} diff --git a/src/index.tsx b/src/index.tsx index 8d978ff..b3c802b 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,13 +1,13 @@ -import React from "react"; -import { createRoot } from "react-dom/client"; +import React from 'react' +import {createRoot} from 'react-dom/client' -import App from "./App"; +import App from './App' -const container = document.getElementById("root") as HTMLElement; -const root = createRoot(container); +const container = document.getElementById('root') as HTMLElement +const root = createRoot(container) root.render( - -); + , +) diff --git a/src/pages/blog-posts/create.tsx b/src/pages/blog-posts/create.tsx index 109996e..448252b 100644 --- a/src/pages/blog-posts/create.tsx +++ b/src/pages/blog-posts/create.tsx @@ -1,120 +1,96 @@ -import { Autocomplete, Box, MenuItem, Select, TextField } from "@mui/material"; -import { Create, useAutocomplete } from "@refinedev/mui"; -import { useForm } from "@refinedev/react-hook-form"; -import React from "react"; -import { Controller } from "react-hook-form"; +import {Autocomplete, Box, MenuItem, Select, TextField} from '@mui/material' +import {Create, useAutocomplete} from '@refinedev/mui' +import {useForm} from '@refinedev/react-hook-form' +import React from 'react' +import {Controller} from 'react-hook-form' export const BlogPostCreate = () => { const { saveButtonProps, - refineCore: { formLoading }, + refineCore: {formLoading}, register, control, - formState: { errors }, - } = useForm({}); + formState: {errors}, + } = useForm({}) - const { autocompleteProps: categoryAutocompleteProps } = useAutocomplete({ - resource: "categories", - }); + const {autocompleteProps: categoryAutocompleteProps} = useAutocomplete({ + resource: 'categories', + }) return ( - + ( + render={({field}) => ( { - field.onChange(value.id); + field.onChange(value.id) }} getOptionLabel={(item) => { return ( categoryAutocompleteProps?.options?.find((p) => { - const itemId = - typeof item === "object" - ? item?.id?.toString() - : item?.toString(); - const pId = p?.id?.toString(); - return itemId === pId; - })?.title ?? "" - ); + const itemId = typeof item === 'object' ? item?.id?.toString() : item?.toString() + const pId = p?.id?.toString() + return itemId === pId + })?.title ?? '' + ) }} isOptionEqualToValue={(option, value) => { - const optionId = option?.id?.toString(); - const valueId = - typeof value === "object" - ? value?.id?.toString() - : value?.toString(); - return value === undefined || optionId === valueId; + const optionId = option?.id?.toString() + const valueId = typeof value === 'object' ? value?.id?.toString() : value?.toString() + return value === undefined || optionId === valueId }} - renderInput={(params) => ( - - )} + renderInput={(params) => } /> )} /> { + render={({field}) => { return ( - Draft Published Rejected - ); + ) }} /> - ); -}; + ) +} diff --git a/src/pages/blog-posts/edit.tsx b/src/pages/blog-posts/edit.tsx index 918b495..ccaa54f 100644 --- a/src/pages/blog-posts/edit.tsx +++ b/src/pages/blog-posts/edit.tsx @@ -1,125 +1,101 @@ -import { Autocomplete, Box, Select, TextField } from "@mui/material"; -import MenuItem from "@mui/material/MenuItem"; -import { Edit, useAutocomplete } from "@refinedev/mui"; -import { useForm } from "@refinedev/react-hook-form"; -import React from "react"; -import { Controller } from "react-hook-form"; +import {Autocomplete, Box, Select, TextField} from '@mui/material' +import MenuItem from '@mui/material/MenuItem' +import {Edit, useAutocomplete} from '@refinedev/mui' +import {useForm} from '@refinedev/react-hook-form' +import React from 'react' +import {Controller} from 'react-hook-form' export const BlogPostEdit = () => { const { saveButtonProps, - refineCore: { queryResult, formLoading }, + refineCore: {queryResult, formLoading}, register, control, - formState: { errors }, - } = useForm({}); + formState: {errors}, + } = useForm({}) - const blogPostsData = queryResult?.data?.data; + const blogPostsData = queryResult?.data?.data - const { autocompleteProps: categoryAutocompleteProps } = useAutocomplete({ - resource: "categories", + const {autocompleteProps: categoryAutocompleteProps} = useAutocomplete({ + resource: 'categories', defaultValue: blogPostsData?.category?.id, - }); + }) return ( - + ( + render={({field}) => ( { - field.onChange(value.id); + field.onChange(value.id) }} getOptionLabel={(item) => { return ( categoryAutocompleteProps?.options?.find((p) => { - const itemId = - typeof item === "object" - ? item?.id?.toString() - : item?.toString(); - const pId = p?.id?.toString(); - return itemId === pId; - })?.title ?? "" - ); + const itemId = typeof item === 'object' ? item?.id?.toString() : item?.toString() + const pId = p?.id?.toString() + return itemId === pId + })?.title ?? '' + ) }} isOptionEqualToValue={(option, value) => { - const optionId = option?.id?.toString(); - const valueId = - typeof value === "object" - ? value?.id?.toString() - : value?.toString(); - return value === undefined || optionId === valueId; + const optionId = option?.id?.toString() + const valueId = typeof value === 'object' ? value?.id?.toString() : value?.toString() + return value === undefined || optionId === valueId }} - renderInput={(params) => ( - - )} + renderInput={(params) => } /> )} /> { + render={({field}) => { return ( - Draft Published Rejected - ); + ) }} /> - ); -}; + ) +} diff --git a/src/pages/blog-posts/index.ts b/src/pages/blog-posts/index.ts index 59ff017..0f886cc 100644 --- a/src/pages/blog-posts/index.ts +++ b/src/pages/blog-posts/index.ts @@ -1,4 +1,4 @@ -export * from "./create"; -export * from "./edit"; -export * from "./list"; -export * from "./show"; +export * from './create' +export * from './edit' +export * from './list' +export * from './show' diff --git a/src/pages/blog-posts/list.tsx b/src/pages/blog-posts/list.tsx index a9eff6b..1f841a3 100644 --- a/src/pages/blog-posts/list.tsx +++ b/src/pages/blog-posts/list.tsx @@ -1,124 +1,105 @@ -import { DataGrid, type GridColDef } from "@mui/x-data-grid"; -import { useMany } from "@refinedev/core"; -import { - DateField, - DeleteButton, - EditButton, - List, - ShowButton, - useDataGrid, -} from "@refinedev/mui"; -import { Typography } from "@mui/material"; -import React from "react"; +import {DataGrid, type GridColDef} from '@mui/x-data-grid' +import {useMany} from '@refinedev/core' +import {DateField, DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui' +import {Typography} from '@mui/material' +import React from 'react' export const BlogPostList = () => { - const { dataGridProps } = useDataGrid({}); + const {dataGridProps} = useDataGrid({}) - const { data: categoryData, isLoading: categoryIsLoading } = useMany({ - resource: "categories", - ids: - dataGridProps?.rows - ?.map((item: any) => item?.category?.id) - .filter(Boolean) ?? [], + const {data: categoryData, isLoading: categoryIsLoading} = useMany({ + resource: 'categories', + ids: dataGridProps?.rows?.map((item: any) => item?.category?.id).filter(Boolean) ?? [], queryOptions: { enabled: !!dataGridProps?.rows, }, - }); + }) const columns = React.useMemo( () => [ { - field: "id", - headerName: "ID", - type: "number", + field: 'id', + headerName: 'ID', + type: 'number', minWidth: 50, - display: "flex", - align: "left", - headerAlign: "left", + display: 'flex', + align: 'left', + headerAlign: 'left', }, { - field: "title", - headerName: "Title", + field: 'title', + headerName: 'Title', minWidth: 200, - display: "flex", + display: 'flex', }, { - field: "content", + field: 'content', flex: 1, - headerName: "Content", + headerName: 'Content', minWidth: 250, - display: "flex", - renderCell: function render({ value }) { - if (!value) return "-"; + display: 'flex', + renderCell: function render({value}) { + if (!value) return '-' return ( - + {value} - ); + ) }, }, { - field: "category", - headerName: "Category", + field: 'category', + headerName: 'Category', minWidth: 160, - display: "flex", + display: 'flex', valueGetter: (_, row) => { - const value = row?.category; - return value; + const value = row?.category + return value }, - renderCell: function render({ value }) { - return categoryIsLoading ? ( - <>Loading... - ) : ( - categoryData?.data?.find((item) => item.id === value?.id)?.title - ); + renderCell: function render({value}) { + return categoryIsLoading ? <>Loading... : categoryData?.data?.find((item) => item.id === value?.id)?.title }, }, { - field: "status", - headerName: "Status", + field: 'status', + headerName: 'Status', minWidth: 80, - display: "flex", + display: 'flex', }, { - field: "createdAt", - headerName: "Created at", + field: 'createdAt', + headerName: 'Created at', minWidth: 120, - display: "flex", - renderCell: function render({ value }) { - return ; + display: 'flex', + renderCell: function render({value}) { + return }, }, { - field: "actions", - headerName: "Actions", - align: "right", - headerAlign: "right", + field: 'actions', + headerName: 'Actions', + align: 'right', + headerAlign: 'right', minWidth: 120, sortable: false, - display: "flex", - renderCell: function render({ row }) { + display: 'flex', + renderCell: function render({row}) { return ( <> - ); + ) }, }, ], - [categoryData, categoryIsLoading] - ); + [categoryData, categoryIsLoading], + ) return ( - ); -}; + ) +} diff --git a/src/pages/blog-posts/show.tsx b/src/pages/blog-posts/show.tsx index 42489a4..e332665 100644 --- a/src/pages/blog-posts/show.tsx +++ b/src/pages/blog-posts/show.tsx @@ -1,59 +1,53 @@ -import { Stack, Typography } from "@mui/material"; -import { useOne, useShow } from "@refinedev/core"; -import { - DateField, - MarkdownField, - NumberField, - Show, - TextFieldComponent as TextField, -} from "@refinedev/mui"; +import {Stack, Typography} from '@mui/material' +import {useOne, useShow} from '@refinedev/core' +import {DateField, MarkdownField, NumberField, Show, TextFieldComponent as TextField} from '@refinedev/mui' export const BlogPostShow = () => { - const { query } = useShow({}); + const {query} = useShow({}) - const { data, isLoading } = query; + const {data, isLoading} = query - const record = data?.data; + const record = data?.data - const { data: categoryData, isLoading: categoryIsLoading } = useOne({ - resource: "categories", - id: record?.category?.id || "", + const {data: categoryData, isLoading: categoryIsLoading} = useOne({ + resource: 'categories', + id: record?.category?.id || '', queryOptions: { enabled: !!record, }, - }); + }) return ( - {"ID"} + {'ID'} - {"Title"} + {'Title'} - {"Content"} + {'Content'} - {"Category"} + {'Category'} {categoryIsLoading ? <>Loading... : <>{categoryData?.data?.title}} - {"Status"} + {'Status'} - {"CreatedAt"} + {'CreatedAt'} - ); -}; + ) +} diff --git a/src/pages/categories/create.tsx b/src/pages/categories/create.tsx index 193e4f5..500e30b 100644 --- a/src/pages/categories/create.tsx +++ b/src/pages/categories/create.tsx @@ -1,36 +1,32 @@ -import { Box, TextField } from "@mui/material"; -import { Create } from "@refinedev/mui"; -import { useForm } from "@refinedev/react-hook-form"; +import {Box, TextField} from '@mui/material' +import {Create} from '@refinedev/mui' +import {useForm} from '@refinedev/react-hook-form' export const CategoryCreate = () => { const { saveButtonProps, - refineCore: { formLoading }, + refineCore: {formLoading}, register, - formState: { errors }, - } = useForm({}); + formState: {errors}, + } = useForm({}) return ( - + - ); -}; + ) +} diff --git a/src/pages/categories/edit.tsx b/src/pages/categories/edit.tsx index f443746..80fa38c 100644 --- a/src/pages/categories/edit.tsx +++ b/src/pages/categories/edit.tsx @@ -1,35 +1,31 @@ -import { Box, TextField } from "@mui/material"; -import { Edit } from "@refinedev/mui"; -import { useForm } from "@refinedev/react-hook-form"; +import {Box, TextField} from '@mui/material' +import {Edit} from '@refinedev/mui' +import {useForm} from '@refinedev/react-hook-form' export const CategoryEdit = () => { const { saveButtonProps, register, - formState: { errors }, - } = useForm({}); + formState: {errors}, + } = useForm({}) return ( - + - ); -}; + ) +} diff --git a/src/pages/categories/index.ts b/src/pages/categories/index.ts index 59ff017..0f886cc 100644 --- a/src/pages/categories/index.ts +++ b/src/pages/categories/index.ts @@ -1,4 +1,4 @@ -export * from "./create"; -export * from "./edit"; -export * from "./list"; -export * from "./show"; +export * from './create' +export * from './edit' +export * from './list' +export * from './show' diff --git a/src/pages/categories/list.tsx b/src/pages/categories/list.tsx index 1e6a18c..5e40dab 100644 --- a/src/pages/categories/list.tsx +++ b/src/pages/categories/list.tsx @@ -1,59 +1,53 @@ -import { DataGrid, type GridColDef } from "@mui/x-data-grid"; -import { - DeleteButton, - EditButton, - List, - ShowButton, - useDataGrid, -} from "@refinedev/mui"; -import React from "react"; +import {DataGrid, type GridColDef} from '@mui/x-data-grid' +import {DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui' +import React from 'react' export const CategoryList = () => { - const { dataGridProps } = useDataGrid({}); + const {dataGridProps} = useDataGrid({}) const columns = React.useMemo( () => [ { - field: "id", - headerName: "ID", - type: "number", + field: 'id', + headerName: 'ID', + type: 'number', minWidth: 50, - display: "flex", - align: "left", - headerAlign: "left", + display: 'flex', + align: 'left', + headerAlign: 'left', }, { - field: "title", + field: 'title', flex: 1, - headerName: "Title", + headerName: 'Title', minWidth: 200, - display: "flex", + display: 'flex', }, { - field: "actions", - headerName: "Actions", - align: "right", - headerAlign: "right", + field: 'actions', + headerName: 'Actions', + align: 'right', + headerAlign: 'right', minWidth: 120, sortable: false, - display: "flex", - renderCell: function render({ row }) { + display: 'flex', + renderCell: function render({row}) { return ( <> - ); + ) }, }, ], - [] - ); + [], + ) return ( - ); -}; + ) +} diff --git a/src/pages/categories/show.tsx b/src/pages/categories/show.tsx index cd85134..efa8ad8 100644 --- a/src/pages/categories/show.tsx +++ b/src/pages/categories/show.tsx @@ -1,29 +1,25 @@ -import { Stack, Typography } from "@mui/material"; -import { useShow } from "@refinedev/core"; -import { - NumberField, - Show, - TextFieldComponent as TextField, -} from "@refinedev/mui"; +import {Stack, Typography} from '@mui/material' +import {useShow} from '@refinedev/core' +import {NumberField, Show, TextFieldComponent as TextField} from '@refinedev/mui' export const CategoryShow = () => { - const { query } = useShow({}); - const { data, isLoading } = query; + const {query} = useShow({}) + const {data, isLoading} = query - const record = data?.data; + const record = data?.data return ( - {"ID"} + {'ID'} - {"Title"} + {'Title'} - ); -}; + ) +} diff --git a/src/pages/forgotPassword/index.tsx b/src/pages/forgotPassword/index.tsx index 609e981..3b91820 100644 --- a/src/pages/forgotPassword/index.tsx +++ b/src/pages/forgotPassword/index.tsx @@ -1,5 +1,5 @@ -import { AuthPage } from "@refinedev/mui"; +import {AuthPage} from '@refinedev/mui' export const ForgotPassword = () => { - return ; -}; + return +} diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index 19d21ac..5c6cc3f 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -1,12 +1,12 @@ -import { AuthPage } from "@refinedev/mui"; +import {AuthPage} from '@refinedev/mui' export const Login = () => { return ( - ); -}; + ) +} diff --git a/src/pages/register/index.tsx b/src/pages/register/index.tsx index cb022c7..1a72dea 100644 --- a/src/pages/register/index.tsx +++ b/src/pages/register/index.tsx @@ -1,5 +1,5 @@ -import { AuthPage } from "@refinedev/mui"; +import {AuthPage} from '@refinedev/mui' export const Register = () => { - return ; -}; + return +} diff --git a/vite.config.ts b/vite.config.ts index 081c8d9..db80a72 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,6 +1,6 @@ -import { defineConfig } from "vite"; -import react from "@vitejs/plugin-react"; +import {defineConfig} from 'vite' +import react from '@vitejs/plugin-react' export default defineConfig({ plugins: [react()], -}); +})