shkong/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev synced 2025-05-05 06:33:45 +08:00
Code Packages Projects Releases Activity

chore: replace mui grid with mui grid2

Browse Source
This commit is contained in:
huzibaca 2024-11-25 01:34:18 +08:00
parent ea5d6f9c46
commit c78c936762
No known key found for this signature in database
GPG Key ID: D4364EE4851DC302
1 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/pages/test.tsx
View File

@ -1,6 +1,7 @@
import { useEffect, useRef } from "react"; import { useEffect, useRef } from "react";
import { useVerge } from "@/hooks/use-verge"; import { useVerge } from "@/hooks/use-verge";
import { Box, Button, Grid } from "@mui/material"; import { Box, Button } from "@mui/material";
import Grid2 from "@mui/material/Grid2";
import { import {
DndContext, DndContext,
closestCenter, closestCenter,
@ -34,7 +35,7 @@ const TestPage = () => {
useSensor(PointerSensor), useSensor(PointerSensor),
useSensor(KeyboardSensor, { useSensor(KeyboardSensor, {
coordinateGetter: sortableKeyboardCoordinates, coordinateGetter: sortableKeyboardCoordinates,
}) }),
); );
const { verge, mutateVerge, patchVerge } = useVerge(); const { verge, mutateVerge, patchVerge } = useVerge();
@ -68,7 +69,7 @@ const TestPage = () => {
const onTestListItemChange = ( const onTestListItemChange = (
uid: string, uid: string,
patch?: Partial<IVergeTestItem> patch?: Partial<IVergeTestItem>,
) => { ) => {
if (patch) { if (patch) {
const newList = testList.map((x) => { const newList = testList.map((x) => {
@ -157,24 +158,28 @@ const TestPage = () => {
onDragEnd={onDragEnd} onDragEnd={onDragEnd}
> >
<Box sx={{ mb: 4.5 }}> <Box sx={{ mb: 4.5 }}>
<Grid container spacing={{ xs: 1, lg: 1 }}> <Grid2 container spacing={{ xs: 1, lg: 1 }}>
<SortableContext <SortableContext
items={testList.map((x) => { items={testList.map((x) => {
return x.uid; return x.uid;
})} })}
> >
{testList.map((item) => ( {testList.map((item) => (
<Grid item xs={6} sm={4} md={3} lg={2} key={item.uid}> <Grid2
component={"div"}
size={{ xs: 6, lg: 2, sm: 4, md: 3 }}
key={item.uid}
>
<TestItem <TestItem
id={item.uid} id={item.uid}
itemData={item} itemData={item}
onEdit={() => viewerRef.current?.edit(item)} onEdit={() => viewerRef.current?.edit(item)}
onDelete={onDeleteTestListItem} onDelete={onDeleteTestListItem}
/> />
</Grid> </Grid2>
))} ))}
</SortableContext> </SortableContext>
</Grid> </Grid2>
</Box> </Box>
</DndContext> </DndContext>
</Box> </Box>