@tuturuuu/ui 0.16.0 → 0.18.0

package/src/components/ui/tu-do/templates/task-template-dialogs.tsx

@@ -1,376 +0,0 @@
-'use client';
-
-import type {
-  WorkspaceTaskBoardListItem,
-  WorkspaceTaskListSummary,
-} from '@tuturuuu/internal-api/tasks';
-import { Button } from '@tuturuuu/ui/button';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from '@tuturuuu/ui/dialog';
-import { Input } from '@tuturuuu/ui/input';
-import { Label } from '@tuturuuu/ui/label';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '@tuturuuu/ui/select';
-import { Textarea } from '@tuturuuu/ui/textarea';
-import { useTranslations } from 'next-intl';
-import { useEffect, useId, useState } from 'react';
-import type {
-  WorkspaceTaskTemplate,
-  WorkspaceTaskTemplatePayload,
-} from './task-template-api';
-
-type Visibility = 'private' | 'workspace';
-
-interface CreateTaskTemplateDialogProps {
-  onCreate: (payload: WorkspaceTaskTemplatePayload) => void;
-  onOpenChange: (open: boolean) => void;
-  open: boolean;
-  pending: boolean;
-}
-
-export function CreateTaskTemplateDialog({
-  onCreate,
-  onOpenChange,
-  open,
-  pending,
-}: CreateTaskTemplateDialogProps) {
-  const t = useTranslations('ws-task-templates');
-  const nameId = useId();
-  const keyId = useId();
-  const taskNameId = useId();
-  const descriptionId = useId();
-  const [name, setName] = useState('');
-  const [key, setKey] = useState('');
-  const [taskName, setTaskName] = useState('');
-  const [description, setDescription] = useState('');
-  const [priority, setPriority] = useState<string>('none');
-  const [visibility, setVisibility] = useState<Visibility>('private');
-
-  useEffect(() => {
-    if (!open) return;
-    setName('');
-    setKey('');
-    setTaskName('');
-    setDescription('');
-    setPriority('none');
-    setVisibility('private');
-  }, [open]);
-
-  const canSubmit = name.trim().length > 0 || taskName.trim().length > 0;
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>{t('create.title')}</DialogTitle>
-          <DialogDescription>{t('create.description')}</DialogDescription>
-        </DialogHeader>
-        <div className="space-y-4">
-          <div className="space-y-2">
-            <Label htmlFor={nameId}>{t('fields.template_name')}</Label>
-            <Input
-              id={nameId}
-              value={name}
-              onChange={(event) => setName(event.target.value)}
-              placeholder={t('fields.template_name_placeholder')}
-            />
-          </div>
-          <div className="space-y-2">
-            <Label htmlFor={keyId}>{t('fields.key')}</Label>
-            <Input
-              id={keyId}
-              value={key}
-              onChange={(event) => setKey(event.target.value)}
-              placeholder={t('fields.key_placeholder')}
-            />
-          </div>
-          <div className="space-y-2">
-            <Label htmlFor={taskNameId}>{t('fields.task_name')}</Label>
-            <Input
-              id={taskNameId}
-              value={taskName}
-              onChange={(event) => setTaskName(event.target.value)}
-              placeholder={t('fields.task_name_placeholder')}
-            />
-          </div>
-          <div className="space-y-2">
-            <Label htmlFor={descriptionId}>{t('fields.description')}</Label>
-            <Textarea
-              id={descriptionId}
-              value={description}
-              onChange={(event) => setDescription(event.target.value)}
-              placeholder={t('fields.description_placeholder')}
-            />
-          </div>
-          <div className="grid gap-3 sm:grid-cols-2">
-            <Select value={priority} onValueChange={setPriority}>
-              <SelectTrigger>
-                <SelectValue placeholder={t('fields.priority')} />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="none">{t('priority.none')}</SelectItem>
-                <SelectItem value="low">{t('priority.low')}</SelectItem>
-                <SelectItem value="normal">{t('priority.normal')}</SelectItem>
-                <SelectItem value="high">{t('priority.high')}</SelectItem>
-                <SelectItem value="critical">
-                  {t('priority.critical')}
-                </SelectItem>
-              </SelectContent>
-            </Select>
-            <Select
-              value={visibility}
-              onValueChange={(value) => setVisibility(value as Visibility)}
-            >
-              <SelectTrigger>
-                <SelectValue placeholder={t('fields.visibility')} />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="private">
-                  {t('visibility.private')}
-                </SelectItem>
-                <SelectItem value="workspace">
-                  {t('visibility.workspace')}
-                </SelectItem>
-              </SelectContent>
-            </Select>
-          </div>
-        </div>
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t('actions.cancel')}
-          </Button>
-          <Button
-            disabled={!canSubmit || pending}
-            onClick={() =>
-              onCreate({
-                description: description.trim() || null,
-                key: key.trim() || undefined,
-                name: name.trim() || taskName.trim(),
-                priority: priority === 'none' ? null : (priority as never),
-                task_name: taskName.trim() || name.trim(),
-                visibility,
-              })
-            }
-          >
-            {t('actions.create')}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
-
-interface UseTaskTemplateDialogProps {
-  boards: WorkspaceTaskBoardListItem[];
-  lists: WorkspaceTaskListSummary[];
-  loadingLists: boolean;
-  onBoardChange: (boardId: string) => void;
-  onListChange: (listId: string) => void;
-  onOpenChange: (open: boolean) => void;
-  onUse: (payload: { listId: string; name?: string }) => void;
-  open: boolean;
-  pending: boolean;
-  selectedBoardId: string;
-  selectedListId: string;
-  template: WorkspaceTaskTemplate | null;
-}
-
-export function UseTaskTemplateDialog({
-  boards,
-  lists,
-  loadingLists,
-  onBoardChange,
-  onListChange,
-  onOpenChange,
-  onUse,
-  open,
-  pending,
-  selectedBoardId,
-  selectedListId,
-  template,
-}: UseTaskTemplateDialogProps) {
-  const t = useTranslations('ws-task-templates');
-  const overrideNameId = useId();
-  const [name, setName] = useState('');
-
-  useEffect(() => {
-    if (open) setName('');
-  }, [open]);
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>{t('use.title')}</DialogTitle>
-          <DialogDescription>
-            {template
-              ? t('use.description', { name: template.name })
-              : t('use.description_empty')}
-          </DialogDescription>
-        </DialogHeader>
-        <div className="space-y-4">
-          <Select value={selectedBoardId} onValueChange={onBoardChange}>
-            <SelectTrigger>
-              <SelectValue placeholder={t('fields.board')} />
-            </SelectTrigger>
-            <SelectContent>
-              {boards.map((board) => (
-                <SelectItem key={board.id} value={board.id}>
-                  {board.name || t('fields.unnamed_board')}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-          <Select
-            disabled={!selectedBoardId || loadingLists}
-            onValueChange={onListChange}
-            value={selectedListId}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={t('fields.list')} />
-            </SelectTrigger>
-            <SelectContent>
-              {lists.map((list) => (
-                <SelectItem key={list.id} value={list.id}>
-                  {list.name || t('fields.unnamed_list')}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-          <div className="space-y-2">
-            <Label htmlFor={overrideNameId}>{t('fields.override_name')}</Label>
-            <Input
-              id={overrideNameId}
-              value={name}
-              onChange={(event) => setName(event.target.value)}
-              placeholder={template?.task_name ?? t('fields.task_name')}
-            />
-          </div>
-        </div>
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t('actions.cancel')}
-          </Button>
-          <Button
-            disabled={!template || !selectedListId || pending}
-            onClick={() =>
-              onUse({
-                listId: selectedListId,
-                name: name.trim() || undefined,
-              })
-            }
-          >
-            {t('actions.create_task')}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
-
-interface SaveTaskTemplateFromTaskDialogProps {
-  onOpenChange: (open: boolean) => void;
-  onSave: (payload: {
-    name?: string;
-    taskId: string;
-    visibility: Visibility;
-  }) => void;
-  open: boolean;
-  pending: boolean;
-}
-
-export function SaveTaskTemplateFromTaskDialog({
-  onOpenChange,
-  onSave,
-  open,
-  pending,
-}: SaveTaskTemplateFromTaskDialogProps) {
-  const t = useTranslations('ws-task-templates');
-  const taskIdInput = useId();
-  const nameInput = useId();
-  const [taskId, setTaskId] = useState('');
-  const [name, setName] = useState('');
-  const [visibility, setVisibility] = useState<Visibility>('private');
-
-  useEffect(() => {
-    if (!open) return;
-    setTaskId('');
-    setName('');
-    setVisibility('private');
-  }, [open]);
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>{t('save_from_task.title')}</DialogTitle>
-          <DialogDescription>
-            {t('save_from_task.description')}
-          </DialogDescription>
-        </DialogHeader>
-        <div className="space-y-4">
-          <div className="space-y-2">
-            <Label htmlFor={taskIdInput}>{t('fields.task_id')}</Label>
-            <Input
-              id={taskIdInput}
-              value={taskId}
-              onChange={(event) => setTaskId(event.target.value)}
-              placeholder={t('fields.task_id_placeholder')}
-            />
-          </div>
-          <div className="space-y-2">
-            <Label htmlFor={nameInput}>{t('fields.template_name')}</Label>
-            <Input
-              id={nameInput}
-              value={name}
-              onChange={(event) => setName(event.target.value)}
-              placeholder={t('fields.template_name_placeholder')}
-            />
-          </div>
-          <Select
-            value={visibility}
-            onValueChange={(value) => setVisibility(value as Visibility)}
-          >
-            <SelectTrigger>
-              <SelectValue placeholder={t('fields.visibility')} />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value="private">{t('visibility.private')}</SelectItem>
-              <SelectItem value="workspace">
-                {t('visibility.workspace')}
-              </SelectItem>
-            </SelectContent>
-          </Select>
-        </div>
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t('actions.cancel')}
-          </Button>
-          <Button
-            disabled={!taskId.trim() || pending}
-            onClick={() =>
-              onSave({
-                name: name.trim() || undefined,
-                taskId: taskId.trim(),
-                visibility,
-              })
-            }
-          >
-            {t('actions.save')}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components/ui/tu-do/templates/task-templates-hub.test.tsx

@@ -1,114 +0,0 @@
-import '@testing-library/jest-dom';
-import { fireEvent, render, screen } from '@testing-library/react';
-import { describe, expect, it, vi } from 'vitest';
-import { TaskTemplatesHub } from './task-templates-hub';
-
-vi.mock('next-intl', () => ({
-  useTranslations: () => (key: string) => key,
-}));
-
-vi.mock('./task-template-client', () => ({
-  TaskTemplateClient: ({
-    initialTemplates,
-    wsId,
-  }: {
-    initialTemplates: Array<{ name: string }>;
-    wsId: string;
-  }) => (
-    <div data-testid="task-template-tab">
-      task templates for {wsId}:{' '}
-      {initialTemplates.map((item) => item.name).join(', ')}
-    </div>
-  ),
-}));
-
-vi.mock('./client', () => ({
-  default: ({
-    initialTemplates,
-    templatesBasePath,
-    wsId,
-  }: {
-    initialTemplates: Array<{ name: string }>;
-    templatesBasePath: string;
-    wsId: string;
-  }) => (
-    <div data-testid="board-template-tab">
-      board templates for {wsId}/{templatesBasePath}:{' '}
-      {initialTemplates.map((item) => item.name).join(', ')}
-    </div>
-  ),
-}));
-
-describe('TaskTemplatesHub', () => {
-  it('defaults to task templates and keeps board templates available', () => {
-    render(
-      <TaskTemplatesHub
-        boardTemplates={[
-          {
-            createdAt: '2026-06-29T00:00:00.000Z',
-            createdBy: 'user-1',
-            description: null,
-            id: 'board-template-1',
-            isOwner: true,
-            name: 'Sprint board',
-            sourceBoardId: 'board-1',
-            stats: { labels: 0, lists: 1, tasks: 0 },
-            updatedAt: '2026-06-29T00:00:00.000Z',
-            visibility: 'workspace',
-            wsId: 'ws-1',
-          },
-        ]}
-        taskTemplates={[
-          {
-            archived_at: null,
-            assignee_ids: [],
-            created_at: '2026-06-29T00:00:00.000Z',
-            created_by: 'user-1',
-            default_board_id: null,
-            default_list_id: null,
-            description: null,
-            description_yjs_state: null,
-            end_date: null,
-            estimation_points: null,
-            id: 'task-template-1',
-            isOwner: true,
-            label_ids: [],
-            name: 'Bug report',
-            priority: null,
-            project_ids: [],
-            slug: 'bug-report',
-            source_task_id: null,
-            start_date: null,
-            task_name: 'Investigate bug',
-            updated_at: '2026-06-29T00:00:00.000Z',
-            visibility: 'private',
-            ws_id: 'ws-1',
-          },
-        ]}
-        templatesBasePath="tasks/templates"
-        wsId="ws-1"
-      />
-    );
-
-    expect(screen.getByRole('tab', { name: /tabs.tasks/i })).toHaveAttribute(
-      'data-state',
-      'active'
-    );
-    expect(screen.getByTestId('task-template-tab')).toHaveTextContent(
-      'Bug report'
-    );
-
-    const boardTab = screen.getByRole('tab', { name: /tabs.boards/i });
-    fireEvent.pointerDown(boardTab);
-    fireEvent.mouseDown(boardTab);
-    fireEvent.click(boardTab);
-
-    expect(boardTab).toHaveAttribute('data-state', 'active');
-    expect(screen.getByTestId('board-template-tab')).toHaveTextContent(
-      'Sprint board'
-    );
-    expect(screen.getByTestId('board-template-tab')).toHaveTextContent(
-      'tasks/templates'
-    );
-  });
-});

package/src/components/ui/tu-do/templates/task-templates-hub.tsx

@@ -1,53 +0,0 @@
-'use client';
-
-import { KanbanSquare, ListTodo } from '@tuturuuu/icons';
-import { Tabs, TabsContent, TabsList, TabsTrigger } from '@tuturuuu/ui/tabs';
-import { useTranslations } from 'next-intl';
-import TemplatesClient from './client';
-import type { WorkspaceTaskTemplate } from './task-template-api';
-import { TaskTemplateClient } from './task-template-client';
-import type { BoardTemplate } from './types';
-
-interface TaskTemplatesHubProps {
-  boardTemplates: BoardTemplate[];
-  onOpenBoardTemplate?: (template: BoardTemplate) => void;
-  taskTemplates?: WorkspaceTaskTemplate[];
-  templatesBasePath?: string;
-  wsId: string;
-}
-
-export function TaskTemplatesHub({
-  boardTemplates,
-  onOpenBoardTemplate,
-  taskTemplates = [],
-  templatesBasePath = 'templates',
-  wsId,
-}: TaskTemplatesHubProps) {
-  const t = useTranslations('ws-task-templates');
-
-  return (
-    <Tabs defaultValue="tasks" className="space-y-4">
-      <TabsList>
-        <TabsTrigger value="tasks">
-          <ListTodo className="h-4 w-4" />
-          {t('tabs.tasks')}
-        </TabsTrigger>
-        <TabsTrigger value="boards">
-          <KanbanSquare className="h-4 w-4" />
-          {t('tabs.boards')}
-        </TabsTrigger>
-      </TabsList>
-      <TabsContent value="tasks">
-        <TaskTemplateClient initialTemplates={taskTemplates} wsId={wsId} />
-      </TabsContent>
-      <TabsContent value="boards">
-        <TemplatesClient
-          initialTemplates={boardTemplates}
-          onOpenTemplate={onOpenBoardTemplate}
-          templatesBasePath={templatesBasePath}
-          wsId={wsId}
-        />
-      </TabsContent>
-    </Tabs>
-  );
-}

package/src/components/ui/tu-do/templates/task-templates-page.tsx

@@ -1,157 +0,0 @@
-import { Store } from '@tuturuuu/icons';
-import { createAdminClient } from '@tuturuuu/supabase/next/server';
-import { Button } from '@tuturuuu/ui/button';
-import FeatureSummary from '@tuturuuu/ui/custom/feature-summary';
-import { TaskTemplatesHub } from '@tuturuuu/ui/tu-do/templates/task-templates-hub';
-import type { BoardTemplate } from '@tuturuuu/ui/tu-do/templates/types';
-import { getCurrentUser } from '@tuturuuu/utils/user-helper';
-import { getWorkspace } from '@tuturuuu/utils/workspace-helper';
-import Link from 'next/link';
-import { notFound, redirect } from 'next/navigation';
-import { getTranslations } from 'next-intl/server';
-
-/**
- * Configuration options for TaskTemplatesPage
- * Allows customization of URL paths based on the consuming app
- */
-interface PageConfig {
-  /**
-   * Base path segment for templates routes
-   * @default 'templates' - for apps/tasks: /{wsId}/templates/...
-   * @example 'tasks/templates' - for apps/web: /{wsId}/tasks/templates/...
-   */
-  templatesBasePath?: string;
-}
-
-interface Props {
-  params: Promise<{
-    wsId: string;
-  }>;
-  /**
-   * Optional configuration for URL customization
-   */
-  config?: PageConfig;
-}
-
-async function getTemplates(
-  wsId: string,
-  userId: string
-): Promise<{ templates: BoardTemplate[] }> {
-  const supabase = await createAdminClient();
-
-  const { data: templates, error } = await supabase
-    .from('board_templates')
-    .select(
-      'id, ws_id, created_by, source_board_id, name, description, visibility, background_path, content, created_at, updated_at'
-    )
-    .eq('ws_id', wsId)
-    .or(`visibility.neq.private,created_by.eq.${userId}`)
-    .order('created_at', { ascending: false });
-
-  if (error) {
-    console.error('Error fetching templates:', error);
-    return { templates: [] };
-  }
-
-  const transformedTemplates: BoardTemplate[] = await Promise.all(
-    templates.map(async (template) => {
-      const content = template.content as {
-        lists?: Array<{ tasks?: unknown[] }>;
-        labels?: unknown[];
-      };
-
-      let backgroundUrl: string | null = null;
-      if (template.background_path) {
-        try {
-          const { data: signedUrlData } = await supabase.storage
-            .from('workspaces')
-            .createSignedUrl(template.background_path, 3600);
-          backgroundUrl = signedUrlData?.signedUrl || null;
-        } catch (e) {
-          console.error('Error generating signed URL:', e);
-        }
-      }
-
-      return {
-        id: template.id,
-        wsId: template.ws_id,
-        createdBy: template.created_by,
-        sourceBoardId: template.source_board_id,
-        name: template.name,
-        description: template.description,
-        visibility: template.visibility as 'private' | 'workspace' | 'public',
-        backgroundUrl,
-        createdAt: template.created_at,
-        updatedAt: template.updated_at,
-        isOwner: template.created_by === userId,
-        stats: {
-          lists: content.lists?.length || 0,
-          tasks:
-            content.lists?.reduce(
-              (acc, list) => acc + (list.tasks?.length || 0),
-              0
-            ) || 0,
-          labels: content.labels?.length || 0,
-        },
-      };
-    })
-  );
-
-  return { templates: transformedTemplates };
-}
-
-/**
- * Shared Task Templates Page component.
- * Handles workspace resolution, permissions, and data fetching.
- * Used by both apps/web and apps/tasks.
- */
-export default async function TaskTemplatesPage({
-  params,
-  config = {},
-}: Props) {
-  const { templatesBasePath = 'templates' } = config;
-
-  const { wsId: id } = await params;
-
-  const user = await getCurrentUser();
-  if (!user) redirect('/login');
-
-  const workspace = await getWorkspace(id);
-  if (!workspace) notFound();
-
-  const wsId = workspace.id;
-
-  const { templates } = await getTemplates(wsId, user.id);
-  const t = await getTranslations('ws-task-templates');
-
-  const marketplaceUrl = `/${wsId}/${templatesBasePath}/marketplace`;
-
-  return (
-    <div className="space-y-6">
-      <FeatureSummary
-        title={
-          <h1 className="font-bold text-2xl tracking-tight">
-            {t('gallery.header')}
-          </h1>
-        }
-        description={t('gallery.description')}
-        action={
-          <Link href={marketplaceUrl}>
-            <Button variant="outline" size="sm" className="gap-2">
-              <Store className="h-4 w-4" />
-              {t('gallery.board_marketplace')}
-            </Button>
-          </Link>
-        }
-      />
-      <TaskTemplatesHub
-        boardTemplates={templates}
-        wsId={wsId}
-        templatesBasePath={templatesBasePath}
-      />
-    </div>
-  );
-}
-
-// Re-export the config type for consumers
-export type { PageConfig as TaskTemplatesPageConfig };