Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | 11x 531x 531x 531x 531x 531x 2x | import { Box, CircularProgress } from "@mui/material";
import GiveButton from "@shared/Button/GiveButton";
import { useCustomThemeV2 } from "@theme/hooks/useCustomThemeV2";
import { usePayBuilderForm } from "../provider/PayBuilderFormProvider";
import { SaveAndCloseBtn } from "./SaveAndCloseBtn";
import { useFormNavigation } from "../hooks/useFormNavigation";
import { useAppTheme } from "@theme/v2/Provider";
export const TopLeftPanelActions = () => {
const { isMediumView } = useCustomThemeV2();
const { palette } = useAppTheme();
const { isLoading } = usePayBuilderForm();
const { handleConfirmBeforeClose, handleSaveDraftClick, isPublishedForm } =
useFormNavigation();
return (
<>
{!isMediumView && <SaveAndCloseBtn onClick={handleConfirmBeforeClose} />}
{!isPublishedForm && (
<Box
sx={{
position: "relative",
display: isMediumView ? "none" : "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<GiveButton
color="light"
variant="filled"
size="small"
label={"Save Draft"}
onClick={() => handleSaveDraftClick()}
endIcon={
isLoading && (
<CircularProgress
size="14px"
sx={{
color: palette.text.primary,
opacity: "1 !important",
}}
/>
)
}
/>
</Box>
)}
</>
);
};
|