yadunut/clan-core
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fixed jumping icon on selected

Browse Source
This commit is contained in:
Luis-Hebendanz
2023-08-15 20:37:34 +02:00
parent 46566131d4
commit 96bf33a76d
1 changed files with 20 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
pkgs/ui/src/app/nodes/NodeList.tsx
View File

@@ -119,7 +119,7 @@ function stableSort<T>(
return stabilizedThis.map((el) => el[0]); return stabilizedThis.map((el) => el[0]);
} }
function CrudSpeedDial(props: {selected: string | undefined}) { function CrudSpeedDial(props: { selected: string | undefined }) {
const { selected } = props; const { selected } = props;
const [open, setOpen] = React.useState(false); const [open, setOpen] = React.useState(false);
@@ -135,7 +135,19 @@ function CrudSpeedDial(props: {selected: string | undefined}) {
} }
} }
const isSomethingSelected = selected != undefined; const isSomethingSelected = selected != undefined;
function editDial() {
if (isSomethingSelected) {
return (
<Link href="/nodes/edit" style={{marginTop: 7.5}}>
<EditIcon color="action" />
</Link>
);
} else {
return <EditIcon color="disabled" />;
}
}
return ( return (
<Box <Box
@@ -161,7 +173,7 @@ function CrudSpeedDial(props: {selected: string | undefined}) {
<SpeedDialAction <SpeedDialAction
key="Add" key="Add"
icon={ icon={
<Link href="/nodes/add"> <Link href="/nodes/add" style={{marginTop: 7.5}}>
<AddIcon color="action" /> <AddIcon color="action" />
</Link> </Link>
} }
@@ -170,18 +182,12 @@ function CrudSpeedDial(props: {selected: string | undefined}) {
<SpeedDialAction <SpeedDialAction
key="Delete" key="Delete"
icon={<DeleteIcon color={isSomethingSelected ? "action" : "disabled"} />} icon={
<DeleteIcon color={isSomethingSelected ? "action" : "disabled"} />
}
tooltipTitle="Delete" tooltipTitle="Delete"
/> />
<SpeedDialAction <SpeedDialAction key="Edit" icon={editDial()} tooltipTitle="Edit" />
key="Edit"
icon={
<Link href="/nodes/edit">
<EditIcon color={isSomethingSelected ? "action" : "disabled"} />
</Link>
}
tooltipTitle="Edit"
/>
</SpeedDial> </SpeedDial>
</Box> </Box>
); );
@@ -289,7 +295,7 @@ function EnhancedTableToolbar(props: EnhancedTableToolbarProps) {
return ( return (
<Grid2 container spacing={1} sx={debugSx}> <Grid2 container spacing={1} sx={debugSx}>
<CrudSpeedDial selected={selected}/> <CrudSpeedDial selected={selected} />
<Grid2 key="Header" xs={6}> <Grid2 key="Header" xs={6}>
<Typography <Typography
sx={{ marginLeft: 3, marginTop: 1 }} sx={{ marginLeft: 3, marginTop: 1 }}