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

some routes added

Browse Source
This commit is contained in:
vkuchenik
2026-06-04 15:30:01 -07:00
parent dd70ec077c
commit fd3cdc69ad
24 changed files with 636 additions and 874 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/Canvas/CanvasComponents/Widget.jsx
+14 -21
View File
@@ -1,37 +1,30 @@
import { useSlotRecipe, chakra, Flex, CloseButton, Text, IconButton } from "@chakra-ui/react"
import { GrUndo } from "react-icons/gr";
import { Undo } from 'lucide-react';
export default function Widget(props) {
// deconstructing props
const { id, title, isEditable, isDelete, DeleteWidget, isSubmit, setIsSubmit, children } = props;
const recipe = useSlotRecipe({ key: "widget" });
const styles = recipe();
return (
<>
<chakra.div css={styles.header} cursor={isEditable ? "move":"default"}>
{isDelete ? (
<>
<Flex flexDirection="row" justifyContent="space-between" alignItems="center">
<Text className="widget-handle" w="100%" fontWeight="bold">{title}</Text>
<CloseButton onClick={() => DeleteWidget(id)} size="xs" _hover={{bg: "tomato", color: "white"}}/>
</Flex>
</>
):(
<>
<Flex flexDirection="row" justifyContent="space-between" alignItems="center">
<Text className="widget-handle" w="100%" display="flex" alignItems="center" height="32px" fontWeight="bold">{title}</Text>
{isSubmit ? (
<IconButton onClick={() => setIsSubmit(false)} size="xs" bg="base300" cursor="pointer"><GrUndo fill="text" /></IconButton>
):(null)}
</Flex>
</>
)}
<Flex flexDirection="row" justifyContent="space-between" alignItems="center">
<Text className="widget-handle" w="100%" display="flex" alignItems="center" height="32px" fontWeight="bold">{title}</Text>
{isDelete ? (
<CloseButton onClick={() => DeleteWidget(id)} size="xs" _hover={{bg: "tomato", color: "white"}}/>
):(
isSubmit ? (
<IconButton onClick={() => setIsSubmit(false)} size="xs" bg="base300" cursor="pointer"><Undo fill="text" /></IconButton>
):null
)}
</Flex>
</chakra.div>
<chakra.div height="100%" mb="2">
<Flex height="100%" mb="2">
{children}
</chakra.div>
</Flex>
</>
);
}