Draft: feature/BQ-250 into [email protected] 🌊 added organizations activities table with add activity modal

.husky/pre-commit

@@ -1,5 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-yarn lint-staged --no-stash
-yarn build
+yarn lint-staged --no-stash

.husky/pre-push

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+yarn build

app/(landing)/(components)/ActivitiesSection/ActivitiesSection.tsx

@@ -57,11 +57,11 @@ export const ActivitiesSection = async ({ cityId }: ActivitiesSectionProps) => {
       </div>
       <div className='mt-16 flex flex-col items-center justify-center gap-8 md:grid md:grid-cols-2 md:justify-between lg:grid-cols-3'>
         {getActivityResponse.rows.map((activity) => {
-          const activityCover = activity.media.find((item) => item.flag === 'AVATAR')!;
+          const activityCover = activity.media.find((item) => item.flag === 'AVATAR');
 
           return (
             <ActivityCard>
-              <ActivityCardImage src={activityCover.url} alt={activity.name} />
+              {activityCover && <ActivityCardImage src={activityCover.url} alt={activity.name} />}
               <ActivityCardHeader>
                 <ActivityCardCategory>{activity.category.RU}</ActivityCardCategory>
                 <ActivityCardName>{activity.name}</ActivityCardName>

app/app/(main)/activities/(components)/ActivityList/ActivityList.tsx

@@ -33,11 +33,11 @@ export const ActivityList = () => {
     <>
       <div className='mt-6 flex flex-col items-center justify-center gap-8 md:grid md:grid-cols-2 md:justify-between lg:grid-cols-3'>
         {activities.map((activity) => {
-          const activityCover = activity.media.find((item) => item.flag === 'AVATAR')!;
+          const activityCover = activity.media.find((item) => item.flag === 'AVATAR');
 
           return (
             <ActivityCard key={activity.id}>
-              <ActivityCardImage src={activityCover.url} alt={activity.name} />
+              {activityCover && <ActivityCardImage src={activityCover.url} alt={activity.name} />}
               <ActivityCardHeader>
                 <ActivityCardCategory>{activity.category.RU}</ActivityCardCategory>
                 <ActivityCardName>{activity.name}</ActivityCardName>

app/org/(panel)/(components)/OrgBreadcrumbs/OrgBreadcrumbs.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import React from 'react';
 import { useParams, usePathname } from 'next/navigation';
 
 import { I18nText } from '@/components/common';
@@ -63,13 +64,13 @@ export const OrgBreadcrumbs = ({ ids = {}, ...props }: OrgBreadcrumbsProps) => {
           );
 
           return (
-            <>
-              <BreadcrumbItem key={href} className='list-none text-base'>
+            <React.Fragment key={href}>
+              <BreadcrumbItem className='list-none text-base'>
                 {clickable && <BreadcrumbLink href={href}>{item}</BreadcrumbLink>}
                 {!clickable && <BreadcrumbPage>{item}</BreadcrumbPage>}
               </BreadcrumbItem>
               {index !== filteredPathnames.length - 1 && <BreadcrumbSeparator />}
-            </>
+            </React.Fragment>
           );
         })}
       </BreadcrumbList>

app/org/(panel)/activities/dashboard/(components)/ActivitiesDashboard/ActivitiesDashboard.tsx

@@ -20,6 +20,7 @@ import { getActivitiesDashboard } from '@/utils/api';
 
 export const ActivitiesDashboard = async () => {
   const dashboard = await getActivitiesDashboard();
+
   return (
     <div className='flex flex-wrap gap-2'>
       <InfoCard>

app/org/(panel)/activities/dashboard/page.tsx

@@ -9,8 +9,8 @@ export interface ActivitiesDashboardPageProps {
   searchParams: SearchParams;
 }
 
-const DEFAULT_ACTIVITIES_LIMIT = '10';
-const DEFAULT_ACTIVITIES_PAGE = '1';
+const DEFAULT_ACTIVITIES_LIMIT = 10;
+const DEFAULT_ACTIVITIES_PAGE = 1;
 
 const ActivitiesDashboardPage = async ({ searchParams }: ActivitiesDashboardPageProps) => {
   const activitiesTableResponse = await getActivities({

app/org/(panel)/organizations/[organizationId]/(components)/OrganizationHeader/OrganizationHeader.tsx

@@ -19,7 +19,8 @@ export const OrganizationHeader = ({ organization }: OrganizationHeaderProps) =>
         priority={false}
         className='h-[168px] w-full rounded-lg'
         src={organization.background || background}
-        alt='org-background'
+        alt={`${organization.name ?? ''} background`}
+        fill
       />
       <div className='absolute bottom-0 mx-4 mt-auto h-36 w-[96%] rounded-lg border-none bg-background/70 pb-4 pl-4 pr-4 pt-3 shadow-sm backdrop-blur-lg'>
         <div className='flex gap-5'>
@@ -29,7 +30,7 @@ export const OrganizationHeader = ({ organization }: OrganizationHeaderProps) =>
             width={80}
             height={80}
             src={organization.avatar || avatar}
-            alt='org-background'
+            alt={`${organization.name ?? ''} avatar`}
           />
           <div className='flex flex-col justify-center'>
             <Typography variant='h5' tag='h5'>

app/org/(panel)/organizations/[organizationId]/(constants)/navigation.tsx

@@ -1,5 +1,5 @@
 import type { LucideIcon } from 'lucide-react';
-import { ActivityIcon, MapPinIcon, UserIcon, UsersRoundIcon } from 'lucide-react';
+import { ActivityIcon, CalendarIcon, MapPinIcon, UserIcon, UsersRoundIcon } from 'lucide-react';
 
 import { ROUTES } from '@/utils/constants';
 
@@ -66,7 +66,7 @@ export const PARTNER_PROFILE_TABS: ProfileTab[] = [
     route: ROUTES.ORG.ORGANIZATIONS.ACTIVITIES
   },
   {
-    icon: ActivityIcon,
+    icon: CalendarIcon,
     title: 'organization.profile.header.schedule',
     value: ORGANIZATION_PROFILE_TAB_VALUES.SCHEDULE,
     route: ROUTES.ORG.ORGANIZATIONS.SCHEDULE

app/org/(panel)/organizations/[organizationId]/activities/page.tsx

@@ -26,8 +26,6 @@ const OrganizationActivitiesPage = async ({ params }: OrganizationActivitiesPage
     }
   });
 
-  console.log('@', getActivityResponse);
-
   return (
     <>
       <div className='flex flex-wrap justify-between gap-3 lgx:p-4'>

app/org/(panel)/organizations/[organizationId]/addresses/(components)/ActionAddressForm/ActionAddressForm.tsx

@@ -178,7 +178,7 @@ export const ActionAddressForm = <ActionType extends AddressActionType>({
                         )}
                       />
                     </div>
-                    <I18nText path='dialog.addAddress.form.untill' />
+                    <I18nText path='dialog.addAddress.form.until' />
                     <div>
                       <FormField
                         control={form.control}

app/org/(panel)/organizations/[organizationId]/addresses/(components)/ActionAddressForm/hooks/useActionAddressForm.tsx

@@ -88,7 +88,7 @@ export const useActionAddressForm = ({
 
     if (actionType === 'edit') {
       const putOrganizationActionAddressParams = {
-        params: { ...requestParams, id: address!.id },
+        params: { ...requestParams, legalEntityId: params.organizationId },
         action: actionType
       } as const;
 

app/org/(panel)/organizations/[organizationId]/schedule/(components)/AddScheduleDialog/AddScheduleDialog.tsx

@@ -0,0 +1,46 @@
+'use client';
+
+import { XIcon } from 'lucide-react';
+
+import { I18nText } from '@/components/common';
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+  Typography
+} from '@/components/ui';
+
+import { AddScheduleForm } from './components/AddScheduleForm/AddScheduleForm';
+import { useAddScheduleDialog } from './hooks/useAddScheduleDialog';
+
+interface AddScheduleDialogProps {
+  trigger: JSX.Element;
+}
+
+export const AddScheduleDialog = ({ trigger }: AddScheduleDialogProps) => {
+  const { functions } = useAddScheduleDialog();
+
+  return (
+    <Dialog>
+      <DialogTrigger asChild>{trigger}</DialogTrigger>
+      <DialogContent className='flex h-fit w-11/12 max-w-[713px] flex-col rounded-lg smx:max-h-[90%]'>
+        <DialogClose>
+          <XIcon className='h-6 w-6' />
+        </DialogClose>
+        <DialogHeader>
+          <DialogTitle>
+            <Typography variant='h4' tag='h4'>
+              <I18nText path='dialog.addSchedule.title' />
+            </Typography>
+          </DialogTitle>
+        </DialogHeader>
+        <div className='flex h-full flex-col items-end justify-between overflow-y-auto rounded-lg border p-5'>
+          <AddScheduleForm onAdded={functions.onAdded} />
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+};