diff --git a/src/components/CustomRoadmap/Showcase/ShowcaseAlert.tsx b/src/components/CustomRoadmap/Showcase/ShowcaseAlert.tsx index ea7b0cad0..8330acef8 100644 --- a/src/components/CustomRoadmap/Showcase/ShowcaseAlert.tsx +++ b/src/components/CustomRoadmap/Showcase/ShowcaseAlert.tsx @@ -1,13 +1,8 @@ -import { - CheckIcon, - EyeIcon, - FlagIcon, - FrownIcon, - SmileIcon, - XIcon, -} from 'lucide-react'; +import { EyeIcon, FlagIcon, FrownIcon, SmileIcon } from 'lucide-react'; import { cn } from '../../../lib/classname'; import type { GetRoadmapResponse } from '../CustomRoadmap'; +import { useState } from 'react'; +import { SubmitShowcaseWarning } from './SubmitShowcaseWarning'; type ShowcaseAlertProps = { currentRoadmap: GetRoadmapResponse; @@ -16,12 +11,12 @@ type ShowcaseAlertProps = { export function ShowcaseAlert(props: ShowcaseAlertProps) { const { currentRoadmap } = props; - // const { showcaseStatus = 'idle' } = currentRoadmap; - // if (showcaseStatus === 'idle') { - // return null; - // } + const [showRejectedReason, setShowRejectedReason] = useState(false); - const showcaseStatus = 'rejected_with_reason'; + const { showcaseStatus = 'idle' } = currentRoadmap; + if (showcaseStatus === 'idle') { + return null; + } const showcaseStatusMap = { submitted: { @@ -45,7 +40,12 @@ export function ShowcaseAlert(props: ShowcaseAlertProps) { label: ( <> Your roadmap needs changes before it can be featured.{' '} - @@ -56,20 +56,30 @@ export function ShowcaseAlert(props: ShowcaseAlertProps) { const { icon: Icon, label, className } = showcaseStatusMap[showcaseStatus]; return ( -
+ {showRejectedReason && ( + { + setShowRejectedReason(false); + }} + /> )} - > -
-
- -
{label}
+ +
+
+
+ +
{label}
+
-
+ ); } diff --git a/src/components/CustomRoadmap/Showcase/SubmitShowcaseWarning.tsx b/src/components/CustomRoadmap/Showcase/SubmitShowcaseWarning.tsx index a71c071e9..4a35dadbc 100644 --- a/src/components/CustomRoadmap/Showcase/SubmitShowcaseWarning.tsx +++ b/src/components/CustomRoadmap/Showcase/SubmitShowcaseWarning.tsx @@ -5,14 +5,13 @@ import { httpPost } from '../../../lib/query-http'; import { useStore } from '@nanostores/react'; import { currentRoadmap } from '../../../stores/roadmap'; import { useToast } from '../../../hooks/use-toast'; +import { DateTime } from 'luxon'; type SubmitShowcaseWarningProps = { onClose: () => void; }; -export function SubmitShowcaseWarning( - props: SubmitShowcaseWarningProps, -) { +export function SubmitShowcaseWarning(props: SubmitShowcaseWarningProps) { const { onClose } = props; const toast = useToast(); @@ -40,8 +39,12 @@ export function SubmitShowcaseWarning( queryClient, ); - const { showcaseStatus = 'idle', showcaseRejectedReason } = - $currentRoadmap || {}; + const { + showcaseStatus = 'idle', + showcaseRejectedReason, + showcaseRejectedAt, + updatedAt, + } = $currentRoadmap || {}; return ( @@ -52,8 +55,7 @@ export function SubmitShowcaseWarning( : 'Featured Listing'}

- {showcaseStatus === 'rejected_with_reason' && - showcaseRejectedReason} + {showcaseStatus === 'rejected_with_reason' && showcaseRejectedReason} {showcaseStatus === 'idle' && ( <> Submitting your roadmap for a featured listing will make it @@ -74,7 +76,26 @@ export function SubmitShowcaseWarning(