chight/Web-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor recipe adjustment

Browse Source
This commit is contained in:
chight
2026-07-29 14:18:10 -07:00
parent 6d0af310ae
commit a6ebe5af1e
1 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/dashboard/SettingsButton.jsx
+15 -7
View File
@@ -10,7 +10,8 @@ import {
Badge, Badge,
Menu, Menu,
HStack, HStack,
useRecipe, useSlotRecipe useRecipe,
useSlotRecipe
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import {Settings, Plus, LayoutGrid, Move, Save, X} from 'lucide-react'; import {Settings, Plus, LayoutGrid, Move, Save, X} from 'lucide-react';
import {useDashboardStore} from "../../store/useDashboardStore.jsx"; import {useDashboardStore} from "../../store/useDashboardStore.jsx";
@@ -29,7 +30,7 @@ export function SettingsButton() {
// Pull the glass container styles for the dropdown // Pull the glass container styles for the dropdown
const panelRecipe = useSlotRecipe({key: "glassPanel"}); const panelRecipe = useSlotRecipe({key: "glassPanel"});
const panelStyles = panelRecipe({ layout: "dropdown" }); const panelStyles = panelRecipe({layout: "dropdown"});
const [isLibraryOpen, setIsLibraryOpen] = useState(false); const [isLibraryOpen, setIsLibraryOpen] = useState(false);
@@ -81,23 +82,23 @@ export function SettingsButton() {
<Menu.Content css={panelStyles.root} zIndex="dropdown" minW="200px"> <Menu.Content css={panelStyles.root} zIndex="dropdown" minW="200px">
{isEditing ? ( {isEditing ? (
<> <>
<Menu.Item onClick={saveEdit} color="green.600" cursor="pointer" _hover={{fontWeight: "semibold"}}> <Menu.Item onClick={saveEdit} color="green.600" cursor="pointer" _hover={{WebkitTextStroke: "0.5px currentColor"}}>
<Save size={16} style={{marginRight: '8px'}}/> Save Layout <Save size={16} style={{marginRight: '8px'}}/> Save Layout
</Menu.Item> </Menu.Item>
<Menu.Item onClick={cancelEdit} color="red.500" cursor="pointer" _hover={{fontWeight: "semibold"}}> <Menu.Item onClick={cancelEdit} color="red.500" cursor="pointer" _hover={{WebkitTextStroke: "0.5px currentColor"}}>
<X size={16} style={{marginRight: '8px'}}/> Discard Changes <X size={16} style={{marginRight: '8px'}}/> Discard Changes
</Menu.Item> </Menu.Item>
</> </>
) : ( ) : (
<Menu.Item onClick={enterEditMode} cursor="pointer" _hover={{fontWeight: "semibold"}}> <Menu.Item onClick={enterEditMode} cursor="pointer" _hover={{WebkitTextStroke: "0.5px currentColor"}}>
<Move size={16} style={{marginRight: '8px'}}/> Edit Layout <Move size={16} style={{marginRight: '8px'}}/> Edit Layout
</Menu.Item> </Menu.Item>
)} )}
<Menu.Separator my={1} borderColor="glassSeperator"/> <Menu.Separator my={1} borderColor="glassSeperator"/>
<Menu.Item onClick={() => setIsLibraryOpen(true)} cursor="pointer" _hover={{fontWeight: "semibold"}}> <Menu.Item onClick={() => setIsLibraryOpen(true)} cursor="pointer" _hover={{WebkitTextStroke: "0.5px currentColor"}}>
<LayoutGrid size={16} style={{marginRight: '8px'}}/> Widget Library <LayoutGrid size={16} style={{marginRight: '8px'}}/> Widget Library
</Menu.Item> </Menu.Item>
</Menu.Content> </Menu.Content>
@@ -105,7 +106,14 @@ export function SettingsButton() {
</Menu.Root> </Menu.Root>
{/* THE WIDGET LIBRARY MODAL (Controlled by isLibraryOpen) */} {/* THE WIDGET LIBRARY MODAL (Controlled by isLibraryOpen) */}
<Dialog.Root open={isLibraryOpen} onOpenChange={(e) => setIsLibraryOpen(e.open)} size="xl" placement="center"> <Dialog.Root
open={isLibraryOpen}
onOpenChange={(e) => setIsLibraryOpen(e.open)}
size="xl"
placement="center"
closeOnInteractOutside={true}
closeOnEscapeKeyDown={true}
>
<Dialog.Backdrop bg="blackAlpha.600"/> <Dialog.Backdrop bg="blackAlpha.600"/>
<Dialog.Positioner> <Dialog.Positioner>
<Dialog.Content bg="gray.50" borderRadius="xl" overflow="hidden" boxShadow="xl" maxW="800px"> <Dialog.Content bg="gray.50" borderRadius="xl" overflow="hidden" boxShadow="xl" maxW="800px">