diff --git a/front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx b/front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx new file mode 100644 index 000000000..f20d8737d --- /dev/null +++ b/front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx @@ -0,0 +1,9 @@ +import { LightButton } from '@/ui/input/button/components/LightButton'; + +type CancelButtonProps = { + onCancel?: () => void; +}; + +export const CancelButton = ({ onCancel }: CancelButtonProps) => { + return ; +}; diff --git a/front/src/modules/settings/components/SaveAndCancelButtons/SaveAndCancelButtons.tsx b/front/src/modules/settings/components/SaveAndCancelButtons/SaveAndCancelButtons.tsx new file mode 100644 index 000000000..069e8aa20 --- /dev/null +++ b/front/src/modules/settings/components/SaveAndCancelButtons/SaveAndCancelButtons.tsx @@ -0,0 +1,29 @@ +import styled from '@emotion/styled'; + +import { CancelButton } from './CancelButton'; +import { SaveButton } from './SaveButton'; + +const StyledContainer = styled.div` + align-items: center; + display: flex; + gap: ${({ theme }) => theme.spacing(1)}; +`; + +type SaveAndCancelButtonsProps = { + onSave?: () => void; + onCancel?: () => void; + isSaveDisabled?: boolean; +}; + +export const SaveAndCancelButtons = ({ + onSave, + onCancel, + isSaveDisabled, +}: SaveAndCancelButtonsProps) => { + return ( + + + + + ); +}; diff --git a/front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx b/front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx new file mode 100644 index 000000000..d1adfe674 --- /dev/null +++ b/front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx @@ -0,0 +1,21 @@ +import { Button } from '@/ui/input/button/components/Button'; +import { IconDeviceFloppy } from '@/ui/input/constants/icons'; + +type SaveButtonProps = { + onSave?: () => void; + disabled?: boolean; +}; + +export const SaveButton = ({ onSave, disabled }: SaveButtonProps) => { + return ( +