add contests

src/views/home/account/contests/ContestsBlock.tsx

@@ -1,22 +1,23 @@
 import { useState, FC } from 'react';
 import { cn } from '../../../../lib/cn';
 import { ChevroneDown } from '../../../../assets/icons/groups';
-import MyContestItem from './MyContestItem';
-import RegisterContestItem from './RegisterContestItem';
-import { Contest } from '../../../../redux/slices/contests';
+import { ContestItem } from '../../../../redux/slices/profile';
+import PastContestItem from './PastContestItem';
+import UpcoingContestItem from './UpcomingContestItem';
+import EditContestItem from './EditContestItem';
 
 interface ContestsBlockProps {
-    contests: Contest[];
+    contests?: ContestItem[];
     title: string;
     className?: string;
-    type?: 'my' | 'reg';
+    type?: 'edit' | 'upcoming' | 'past';
 }
 
 const ContestsBlock: FC<ContestsBlockProps> = ({
     contests,
     title,
     className,
-    type = 'my',
+    type = 'edit',
 }) => {
     const [active, setActive] = useState<boolean>(title != 'Скрытые');
 
@@ -36,11 +37,11 @@ const ContestsBlock: FC<ContestsBlockProps> = ({
                     setActive(!active);
                 }}
             >
-                <span>{title}</span>
+                <span className=" select-none">{title}</span>
                 <img
                     src={ChevroneDown}
                     className={cn(
-                        'transition-all duration-300',
+                        'transition-all duration-300 select-none',
                         active && 'rotate-180',
                     )}
                 />
@@ -53,35 +54,38 @@ const ContestsBlock: FC<ContestsBlockProps> = ({
             >
                 <div className="overflow-hidden">
                     <div className="pb-[10px] pt-[20px]">
-                        {contests.map((v, i) => {
-                            return type == 'my' ? (
-                                <MyContestItem
-                                    key={i}
-                                    id={v.id}
-                                    name={v.name}
-                                    startAt={v.startsAt ?? ''}
-                                    duration={
-                                        new Date(v.endsAt ?? '').getTime() -
-                                        new Date(v.startsAt ?? '').getTime()
-                                    }
-                                    members={(v.members??[]).length}
-                                    type={i % 2 ? 'second' : 'first'}
-                                />
-                            ) : (
-                                <RegisterContestItem
-                                    key={i}
-                                    id={v.id}
-                                    name={v.name}
-                                    startAt={v.startsAt ?? ''}
-                                    statusRegister={'reg'}
-                                    duration={
-                                        new Date(v.endsAt ?? '').getTime() -
-                                        new Date(v.startsAt ?? '').getTime()
-                                    }
-                                    members={(v.members??[]).length}
-                                    type={i % 2 ? 'second' : 'first'}
-                                />
-                            );
+                        {contests?.map((v, i) => {
+                            if (type == 'past') {
+                                return (
+                                    <PastContestItem
+                                        key={i}
+                                        {...v}
+                                        type={i % 2 ? 'second' : 'first'}
+                                    />
+                                );
+                            }
+
+                            if (type == 'upcoming') {
+                                return (
+                                    <UpcoingContestItem
+                                        key={i}
+                                        {...v}
+                                        type={i % 2 ? 'second' : 'first'}
+                                    />
+                                );
+                            }
+
+                            if (type == 'edit') {
+                                return (
+                                    <EditContestItem
+                                        key={i}
+                                        {...v}
+                                        type={i % 2 ? 'second' : 'first'}
+                                    />
+                                );
+                            }
+
+                            return <></>;
                         })}
                     </div>
                 </div>