@tuturuuu/ui 0.22.0 → 0.24.0

package/src/components/ui/legacy/meet/lib/meet-insights.ts

@@ -0,0 +1,219 @@
+import type {
+  MeetTogetherPlan,
+  PlanUser,
+} from '@tuturuuu/types/primitives/MeetTogetherPlan';
+import type { Timeblock } from '@tuturuuu/types/primitives/Timeblock';
+
+export const MEET_SLOT_MINUTES = 15;
+
+export interface MeetRankedTimeframe {
+  date: string;
+  startMinute: number;
+  endMinute: number;
+  confirmedUserIds: string[];
+  tentativeUserIds: string[];
+  unavailableUserIds: string[];
+  confirmedPercent: number;
+  weightedPercent: number;
+}
+
+export interface MeetPlanInsights {
+  participantCount: number;
+  respondedCount: number;
+  responsePercent: number;
+  peakAttendance: number;
+  peakAttendancePercent: number;
+  averageAvailabilityPercent: number;
+  overlapByDate: Array<{ date: string; peak: number }>;
+  availabilityByHour: Array<{ hour: number; percent: number }>;
+}
+
+function minuteFromTime(value?: string) {
+  const match = value?.match(/^(\d{1,2}):(\d{2})/u);
+  if (!match) return 0;
+  return Number(match[1]) * 60 + Number(match[2]);
+}
+
+function cellKey(date: string, minute: number) {
+  return `${date}:${minute}`;
+}
+
+function buildUserStatusMap(timeblocks: Timeblock[]) {
+  const status = new Map<string, 'confirmed' | 'tentative'>();
+
+  for (const block of timeblocks) {
+    if (!block.user_id || !block.date) continue;
+    const start = minuteFromTime(block.start_time);
+    const end = minuteFromTime(block.end_time);
+
+    for (let minute = start; minute < end; minute += MEET_SLOT_MINUTES) {
+      const key = `${block.user_id}:${cellKey(block.date, minute)}`;
+      if (!block.tentative || !status.has(key)) {
+        status.set(key, block.tentative ? 'tentative' : 'confirmed');
+      }
+    }
+  }
+
+  return status;
+}
+
+export function rankMeetTimeframes({
+  plan,
+  users,
+  timeblocks,
+  includeTentative = true,
+}: {
+  plan: MeetTogetherPlan;
+  users: PlanUser[];
+  timeblocks: Timeblock[];
+  includeTentative?: boolean;
+}): MeetRankedTimeframe[] {
+  const userIds = users.flatMap((user) => (user.id ? [user.id] : []));
+  const participantCount = userIds.length;
+  if (participantCount === 0) return [];
+
+  const startMinute = minuteFromTime(plan.start_time);
+  const endMinute = minuteFromTime(plan.end_time);
+  const duration = Math.max(MEET_SLOT_MINUTES, plan.duration_minutes ?? 60);
+  const status = buildUserStatusMap(timeblocks);
+  const ranked: MeetRankedTimeframe[] = [];
+
+  for (const date of plan.dates ?? []) {
+    for (
+      let candidateStart = startMinute;
+      candidateStart + duration <= endMinute;
+      candidateStart += MEET_SLOT_MINUTES
+    ) {
+      const confirmedUserIds: string[] = [];
+      const tentativeUserIds: string[] = [];
+      const unavailableUserIds: string[] = [];
+
+      for (const userId of userIds) {
+        let confirmed = true;
+        let available = true;
+
+        for (
+          let minute = candidateStart;
+          minute < candidateStart + duration;
+          minute += MEET_SLOT_MINUTES
+        ) {
+          const cellStatus = status.get(`${userId}:${cellKey(date, minute)}`);
+          confirmed &&= cellStatus === 'confirmed';
+          available &&=
+            cellStatus === 'confirmed' || cellStatus === 'tentative';
+        }
+
+        if (confirmed) confirmedUserIds.push(userId);
+        else if (available && includeTentative) tentativeUserIds.push(userId);
+        else unavailableUserIds.push(userId);
+      }
+
+      const confirmedPercent =
+        (confirmedUserIds.length / participantCount) * 100;
+      const weightedPercent =
+        ((confirmedUserIds.length + tentativeUserIds.length * 0.5) /
+          participantCount) *
+        100;
+
+      ranked.push({
+        date,
+        startMinute: candidateStart,
+        endMinute: candidateStart + duration,
+        confirmedUserIds,
+        tentativeUserIds,
+        unavailableUserIds,
+        confirmedPercent,
+        weightedPercent,
+      });
+    }
+  }
+
+  return ranked.sort(
+    (a, b) =>
+      b.confirmedUserIds.length - a.confirmedUserIds.length ||
+      b.weightedPercent - a.weightedPercent ||
+      a.date.localeCompare(b.date) ||
+      a.startMinute - b.startMinute
+  );
+}
+
+export function calculateMeetPlanInsights({
+  plan,
+  users,
+  timeblocks,
+}: {
+  plan: MeetTogetherPlan;
+  users: PlanUser[];
+  timeblocks: Timeblock[];
+}): MeetPlanInsights {
+  const participantCount = users.filter((user) => user.id).length;
+  const respondedIds = new Set(
+    timeblocks.flatMap((block) => (block.user_id ? [block.user_id] : []))
+  );
+  const ranked = rankMeetTimeframes({ plan, users, timeblocks });
+  const overlapByDate = (plan.dates ?? []).map((date) => ({
+    date,
+    peak: Math.max(
+      0,
+      ...ranked
+        .filter((candidate) => candidate.date === date)
+        .map((candidate) => candidate.confirmedUserIds.length)
+    ),
+  }));
+  const peakAttendance = Math.max(0, ...overlapByDate.map(({ peak }) => peak));
+  const averageAvailabilityPercent = ranked.length
+    ? ranked.reduce((sum, candidate) => sum + candidate.weightedPercent, 0) /
+      ranked.length
+    : 0;
+  const status = buildUserStatusMap(timeblocks);
+  const userIds = users.flatMap((user) => (user.id ? [user.id] : []));
+  const dates = plan.dates ?? [];
+  const startHour = Math.floor(minuteFromTime(plan.start_time) / 60);
+  const endHour = Math.ceil(minuteFromTime(plan.end_time) / 60);
+  const availabilityByHour = Array.from(
+    { length: Math.max(0, endHour - startHour) },
+    (_, index) => {
+      const hour = startHour + index;
+      let weightedCells = 0;
+      for (const date of dates) {
+        for (const userId of userIds) {
+          for (let minute = hour * 60; minute < hour * 60 + 60; minute += 15) {
+            const cellStatus = status.get(`${userId}:${cellKey(date, minute)}`);
+            weightedCells +=
+              cellStatus === 'confirmed'
+                ? 1
+                : cellStatus === 'tentative'
+                  ? 0.5
+                  : 0;
+          }
+        }
+      }
+      const possibleCells = dates.length * userIds.length * 4;
+      return {
+        hour,
+        percent: possibleCells ? (weightedCells / possibleCells) * 100 : 0,
+      };
+    }
+  );
+
+  return {
+    participantCount,
+    respondedCount: respondedIds.size,
+    responsePercent: participantCount
+      ? (respondedIds.size / participantCount) * 100
+      : 0,
+    peakAttendance,
+    peakAttendancePercent: participantCount
+      ? (peakAttendance / participantCount) * 100
+      : 0,
+    averageAvailabilityPercent,
+    overlapByDate,
+    availabilityByHour,
+  };
+}
+
+export function formatMinuteOfDay(minute: number) {
+  const hours = Math.floor(minute / 60);
+  const minutes = minute % 60;
+  return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;
+}

package/src/components/ui/legacy/meet/lib/meet-timezone.test.ts

@@ -0,0 +1,53 @@
+import type { MeetTogetherPlan } from '@tuturuuu/types/primitives/MeetTogetherPlan';
+import { describe, expect, it } from 'vitest';
+import type { MeetRankedTimeframe } from './meet-insights';
+import { candidateToAbsoluteRange } from './meet-timezone';
+
+const candidate: MeetRankedTimeframe = {
+  date: '2026-08-04',
+  startMinute: 540,
+  endMinute: 600,
+  confirmedUserIds: [],
+  tentativeUserIds: [],
+  unavailableUserIds: [],
+  confirmedPercent: 0,
+  weightedPercent: 0,
+};
+
+describe('Tuturuuu Meet timezone conversion', () => {
+  it('preserves the fixed offset of a legacy plan', () => {
+    const plan: MeetTogetherPlan = {
+      duration_minutes: 60,
+      start_time: '09:00:00+07',
+    };
+    expect(candidateToAbsoluteRange(candidate, plan)).toEqual({
+      startAt: '2026-08-04T02:00:00.000Z',
+      endAt: '2026-08-04T03:00:00.000Z',
+    });
+  });
+
+  it('uses IANA daylight-saving rules', () => {
+    const plan: MeetTogetherPlan = {
+      duration_minutes: 60,
+      start_time: '09:00:00-04',
+      timezone: 'America/New_York',
+    };
+    expect(candidateToAbsoluteRange(candidate, plan)?.startAt).toBe(
+      '2026-08-04T13:00:00.000Z'
+    );
+  });
+
+  it('rejects a nonexistent DST window', () => {
+    const plan: MeetTogetherPlan = {
+      duration_minutes: 60,
+      start_time: '01:00:00-05',
+      timezone: 'America/New_York',
+    };
+    expect(
+      candidateToAbsoluteRange(
+        { ...candidate, date: '2026-03-08', startMinute: 120, endMinute: 180 },
+        plan
+      )
+    ).toBeNull();
+  });
+});

package/src/components/ui/legacy/meet/lib/meet-timezone.ts

@@ -0,0 +1,45 @@
+import type { MeetTogetherPlan } from '@tuturuuu/types/primitives/MeetTogetherPlan';
+import dayjs from 'dayjs';
+import timezone from 'dayjs/plugin/timezone';
+import utc from 'dayjs/plugin/utc';
+import { formatMinuteOfDay, type MeetRankedTimeframe } from './meet-insights';
+
+dayjs.extend(utc);
+dayjs.extend(timezone);
+
+function legacyOffset(plan: MeetTogetherPlan) {
+  const offset = plan.start_time?.match(/([+-]\d{2}(?::?\d{2})?)$/u)?.[1];
+  if (!offset) return 'Z';
+  if (/^[+-]\d{2}$/u.test(offset)) return `${offset}:00`;
+  if (/^[+-]\d{4}$/u.test(offset))
+    return `${offset.slice(0, 3)}:${offset.slice(3)}`;
+  return offset;
+}
+
+function localTimestamp(date: string, minute: number) {
+  return `${date}T${formatMinuteOfDay(minute)}:00`;
+}
+
+export function candidateToAbsoluteRange(
+  candidate: MeetRankedTimeframe,
+  plan: MeetTogetherPlan
+) {
+  const startLocal = localTimestamp(candidate.date, candidate.startMinute);
+  const endLocal = localTimestamp(candidate.date, candidate.endMinute);
+  const start = plan.timezone
+    ? dayjs.tz(startLocal, plan.timezone)
+    : dayjs(`${startLocal}${legacyOffset(plan)}`);
+  const end = plan.timezone
+    ? dayjs.tz(endLocal, plan.timezone)
+    : dayjs(`${endLocal}${legacyOffset(plan)}`);
+  const expectedDuration = plan.duration_minutes ?? 60;
+
+  if (
+    !start.isValid() ||
+    !end.isValid() ||
+    end.diff(start, 'minute') !== expectedDuration
+  )
+    return null;
+
+  return { startAt: start.toISOString(), endAt: end.toISOString() };
+}

package/src/components/ui/legacy/meet/page.tsx

@@ -154,6 +154,7 @@ export async function MeetTogetherPage({
             <CardContent className="p-6 md:p-8">
               <Form
                 wsId={wsId}
+                planBasePath={path || '/meet/plans'}
                 user={
                   user
                     ? {

package/src/components/ui/legacy/meet/planId/agenda-details.tsx

@@ -1,7 +1,8 @@
 'use client';
 
-import { updatePlan } from '@tuturuuu/apis/meet/actions';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { ClipboardList, Pencil, Plus } from '@tuturuuu/icons';
+import { type MeetPlanSnapshot, updateMeetPlan } from '@tuturuuu/internal-api';
 import type { MeetTogetherPlan } from '@tuturuuu/types/primitives/MeetTogetherPlan';
 import type { JSONContent } from '@tuturuuu/types/tiptap';
 import { Button } from '@tuturuuu/ui/button';
@@ -16,14 +17,41 @@ interface AgendaDetailsProps {
 }
 
 export default function AgendaDetails({ plan }: AgendaDetailsProps) {
-  const t = useTranslations('meet-together');
+  const t = useTranslations();
   const router = useRouter();
+  const queryClient = useQueryClient();
   const { user } = useTimeBlocking();
   const [editContent, setEditContent] = useState<JSONContent | null>(
     plan.agenda_content || null
   );
   const [isEditing, setIsEditing] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
+  const mutation = useMutation({
+    mutationFn: (agendaContent: JSONContent | null) =>
+      updateMeetPlan(plan.id!, { agenda_content: agendaContent }),
+    onMutate: async (agendaContent) => {
+      if (!plan.id) return {};
+      const queryKey = ['meet-plan', plan.id] as const;
+      await queryClient.cancelQueries({ queryKey });
+      const previous = queryClient.getQueryData<MeetPlanSnapshot>(queryKey);
+      if (previous)
+        queryClient.setQueryData<MeetPlanSnapshot>(queryKey, {
+          ...previous,
+          plan: {
+            ...previous.plan,
+            agenda_content: agendaContent ?? undefined,
+          },
+        });
+      return { previous };
+    },
+    onError: (_error, _agenda, context) => {
+      if (plan.id && context?.previous)
+        queryClient.setQueryData(['meet-plan', plan.id], context.previous);
+    },
+    onSuccess: (snapshot) => {
+      if (plan.id) queryClient.setQueryData(['meet-plan', plan.id], snapshot);
+    },
+  });
 
   const handleEdit = useCallback(() => {
     setIsEditing(true);
@@ -40,23 +68,15 @@ export default function AgendaDetails({ plan }: AgendaDetailsProps) {
 
     setIsLoading(true);
     try {
-      const result = await updatePlan(plan.id, {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        agenda_content: editContent as any,
-      });
-
-      if (result.data) {
-        setIsEditing(false);
-        router.refresh();
-      } else {
-        console.error('Failed to save agenda:', result.error);
-      }
+      await mutation.mutateAsync(editContent);
+      setIsEditing(false);
+      router.refresh();
     } catch (error) {
       console.error('Error saving agenda:', error);
     } finally {
       setIsLoading(false);
     }
-  }, [plan.id, editContent, router]);
+  }, [editContent, mutation, plan.id, router]);
 
   const handleContentChange = useCallback((content: JSONContent | null) => {
     setEditContent(content || null);
@@ -69,9 +89,9 @@ export default function AgendaDetails({ plan }: AgendaDetailsProps) {
     <div className="w-full space-y-8">
       <div className="flex flex-col items-start justify-between gap-4 md:flex-row">
         <div className="space-y-4">
-          <p className="font-semibold text-4xl">{t('agenda')}</p>
+          <p className="font-semibold text-4xl">{t('meet-together.agenda')}</p>
           <p className="text-md text-muted-foreground">
-            {t('agenda_description')}
+            {t('meet-together.agenda_description')}
           </p>
         </div>
         {isEditing ? (
@@ -82,22 +102,24 @@ export default function AgendaDetails({ plan }: AgendaDetailsProps) {
               size="lg"
               disabled={isLoading}
             >
-              Cancel
+              {t('common.cancel')}
             </Button>
             <Button onClick={handleSave} size="lg" disabled={isLoading}>
-              {isLoading ? 'Saving...' : 'Save'}
+              {isLoading
+                ? t('meet-together-plan-details.saving')
+                : t('common.save')}
             </Button>
           </div>
         ) : canEdit ? (
           plan.agenda_content ? (
             <Button onClick={handleEdit} variant="outline" size="lg">
               <Pencil size={16} />
-              Edit
+              {t('common.edit')}
             </Button>
           ) : (
             <Button onClick={handleEdit} variant="default" size="lg">
               <Plus size={16} />
-              Add Agenda
+              {t('meet-together-plan-details.add_agenda')}
             </Button>
           )
         ) : null}
@@ -117,10 +139,11 @@ export default function AgendaDetails({ plan }: AgendaDetailsProps) {
               <ClipboardList size={48} className="text-muted-foreground" />
             </div>
             <div className="space-y-2">
-              <h3 className="font-medium text-lg">No Agenda Content Yet</h3>
+              <h3 className="font-medium text-lg">
+                {t('meet-together-plan-details.no_agenda_title')}
+              </h3>
               <p className="max-w-md text-muted-foreground text-sm">
-                Start organizing your meeting by creating a structured outline
-                to keep everyone on track to make your meeting more productive.
+                {t('meet-together-plan-details.no_agenda_description')}
               </p>
             </div>
           </div>