feat(FE-316): Show success modal after creating uniformity

This commit is contained in:
rstubryan
2025-12-28 10:17:29 +07:00
parent c8f47c741a
commit f37eea687a
3 changed files with 36 additions and 2 deletions
@@ -24,6 +24,7 @@ import toast from 'react-hot-toast';
import Card from '@/components/Card'; import Card from '@/components/Card';
import UniformityTableSkeleton from './skeleton/UniformityTableSkeleton'; import UniformityTableSkeleton from './skeleton/UniformityTableSkeleton';
import RequirePermission from '@/components/helper/RequirePermission'; import RequirePermission from '@/components/helper/RequirePermission';
import { useUniformityStore } from '@/stores/uniformity/uniformity.store';
const statusColorMap: Record<string, string> = { const statusColorMap: Record<string, string> = {
APPROVED: 'bg-[#00D39033]', APPROVED: 'bg-[#00D39033]',
@@ -122,6 +123,9 @@ const RowOptionsMenu = ({
}; };
const UniformityTable = ({ refresh }: { refresh?: () => void }) => { const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
const isSuccess = useUniformityStore((s) => s.isSuccess);
const setIsSuccess = useUniformityStore((s) => s.setIsSuccess);
const { const {
state: tableFilterState, state: tableFilterState,
setPage, setPage,
@@ -145,6 +149,18 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
const [isDeleteLoading, setIsDeleteLoading] = useState(false); const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const singleDeleteModal = useModal(); const singleDeleteModal = useModal();
const successModal = useModal();
useEffect(() => {
if (isSuccess) {
successModal.openModal();
}
}, [isSuccess, successModal]);
const handleSuccessModalClose = () => {
successModal.closeModal();
setIsSuccess(false);
};
const { const {
data: uniformities, data: uniformities,
@@ -442,6 +458,18 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
onClick: singleDeleteHandler, onClick: singleDeleteHandler,
}} }}
/> />
<ConfirmationModal
ref={successModal.ref}
type='success'
text='Uniformity berhasil dibuat!'
closeOnBackdrop={false}
primaryButton={{
text: 'OK',
color: 'success',
onClick: handleSuccessModalClose,
}}
/>
</Card> </Card>
</> </>
); );
@@ -74,6 +74,7 @@ const UniformityResultForm = () => {
(s) => s.setVerifyUniformityResult (s) => s.setVerifyUniformityResult
); );
const uniformityFormData = useUniformityStore((s) => s.uniformityFormData); const uniformityFormData = useUniformityStore((s) => s.uniformityFormData);
const setIsSuccess = useUniformityStore((s) => s.setIsSuccess);
const [isSubmitting, setIsSubmitting] = React.useState(false); const [isSubmitting, setIsSubmitting] = React.useState(false);
@@ -110,8 +111,7 @@ const UniformityResultForm = () => {
return; return;
} }
toast.success('Uniformity created successfully!'); setIsSuccess(true);
setExpandedDrawerOpen(false); setExpandedDrawerOpen(false);
setIsNextStep(false); setIsNextStep(false);
setUniformityStep('preview'); setUniformityStep('preview');
@@ -16,11 +16,13 @@ type UniformityState = {
uniformityStep: UniformityStep; uniformityStep: UniformityStep;
verifyUniformityResult: VerifyUniformityResponse | null; verifyUniformityResult: VerifyUniformityResponse | null;
uniformityFormData: UniformityFormData | null; uniformityFormData: UniformityFormData | null;
isSuccess: boolean;
// Actions // Actions
setUniformityStep: (step: UniformityStep) => void; setUniformityStep: (step: UniformityStep) => void;
setVerifyUniformityResult: (result: VerifyUniformityResponse | null) => void; setVerifyUniformityResult: (result: VerifyUniformityResponse | null) => void;
setUniformityFormData: (data: UniformityFormData | null) => void; setUniformityFormData: (data: UniformityFormData | null) => void;
setIsSuccess: (success: boolean) => void;
resetUniformity: () => void; resetUniformity: () => void;
}; };
@@ -31,6 +33,7 @@ export const useUniformityStore = create<UniformityState>()(
uniformityStep: 'preview', uniformityStep: 'preview',
verifyUniformityResult: null, verifyUniformityResult: null,
uniformityFormData: null, uniformityFormData: null,
isSuccess: false,
// Actions // Actions
setUniformityStep: (step) => set({ uniformityStep: step }), setUniformityStep: (step) => set({ uniformityStep: step }),
@@ -40,11 +43,14 @@ export const useUniformityStore = create<UniformityState>()(
setUniformityFormData: (data) => set({ uniformityFormData: data }), setUniformityFormData: (data) => set({ uniformityFormData: data }),
setIsSuccess: (success) => set({ isSuccess: success }),
resetUniformity: () => resetUniformity: () =>
set({ set({
uniformityStep: 'preview', uniformityStep: 'preview',
verifyUniformityResult: null, verifyUniformityResult: null,
uniformityFormData: null, uniformityFormData: null,
isSuccess: false,
}), }),
}), }),
{ {