@hed-hog/lms 0.0.347 → 0.0.350

package/hedhog/frontend/app/courses/[id]/_components/CourseRelationsCard.tsx.ejs

@@ -1,4 +1,5 @@
 import { RichTextEditor } from '@/components/rich-text-editor';
+import { EntityPicker } from '@/components/ui/entity-picker';
 import {
   FormControl,
   FormField,
@@ -21,6 +22,7 @@ type CourseRelationsCardProps = {
   form: UseFormReturn<CourseEditFormValues>;
   t: TranslationFn;
   categoryOptions: PickerOption[];
+  projectOptions: PickerOption[];
   instructorOptions: PickerOption[];
   onCreateCategory: (
     values: Record<string, string>
@@ -34,6 +36,7 @@ export function CourseRelationsCard({
   form,
   t,
   categoryOptions,
+  projectOptions,
   instructorOptions,
   onCreateCategory,
   onCreateInstructor,
@@ -48,6 +51,31 @@ export function CourseRelationsCard({
     >
       <div className="space-y-3">
         <div className="grid items-start gap-3 lg:grid-cols-2">
+          <FormField
+            control={form.control}
+            name="operationsProjectId"
+            render={({ field }) => (
+              <FormItem className="self-start">
+                <FormLabel>Projeto vinculado</FormLabel>
+                <EntityPicker<PickerOption>
+                  value={field.value}
+                  onChange={(value) => field.onChange(String(value ?? ''))}
+                  options={projectOptions}
+                  placeholder="Selecione um projeto do Operations"
+                  searchPlaceholder="Buscar projeto..."
+                  entityLabel="projeto"
+                  emptyStateDescription="Nenhum projeto encontrado"
+                  getOptionValue={(option) => option.value}
+                  getOptionLabel={(option) => option.label}
+                  getOptionDescription={(option) =>
+                    option.description || option.meta || undefined
+                  }
+                />
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+
           <FormField
             control={form.control}
             name="categorias"

package/hedhog/frontend/app/courses/[id]/_components/course-edit-types.ts.ejs

@@ -9,6 +9,7 @@ export type CourseEditFormValues = {
   status: 'ativo' | 'rascunho' | 'arquivado';
   tipoOferta: 'agendado' | 'sob_demanda' | 'hibrido';
   categorias: string[];
+  operationsProjectId: string;
   primaryColor: string;
   secondaryColor: string;
   instrutores: string[];

package/hedhog/frontend/app/courses/[id]/page.tsx.ejs

@@ -28,7 +28,6 @@ import {
   Video,
 } from 'lucide-react';
 import { useTranslations } from 'next-intl';
-import { useRouter } from 'next/navigation';
 
 import { CourseAvatar } from '../../_components/course-avatar';
 import { ConfirmDialog } from './structure/_components/confirm-dialog';
@@ -70,7 +69,6 @@ export default function CourseStructurePage({ params }: Props) {
   const t = useTranslations('lms.CoursesPage.StructurePage');
   const { id } = use(params);
   const isMobile = useIsMobile();
-  const router = useRouter();
   const { request } = useApp();
 
   const { data: courseSummary } = useQuery<ApiCourseSummary>({
@@ -279,13 +277,6 @@ export default function CourseStructurePage({ params }: Props) {
         extraContent={metricsBadges}
         actions={
           <>
-            <Button
-              variant="outline"
-              size="sm"
-              onClick={() => router.push(`/lms/classes?courseId=${id}`)}
-            >
-              Gerenciar Turmas
-            </Button>
             <TreeDisplaySettingsPopover />
             <ShortcutsHelpTrigger onOpen={() => setShortcutsOpen(true)} />
           </>

package/hedhog/frontend/app/courses/[id]/structure/_components/course-tree-dnd.tsx.ejs

@@ -30,6 +30,7 @@ import {
 import { TreeDragOverlay } from './drag-overlay';
 import { SortableTreeRow } from './sortable-tree-row';
 import { useStructureStore } from './store';
+import { TreeRootContextMenu } from './tree-context-menu';
 import { buildLessonCountMap, buildVisibleItems } from './tree-helpers';
 import type { FlatItem } from './types';
 
@@ -285,74 +286,87 @@ export function CourseTreeDnd() {
             </div>
           )}
 
-          {/* Empty state */}
-          {isEmpty && !isSearchActive && (
-            <div className="flex flex-col items-center justify-center gap-3 py-12 px-4 text-center">
-              <div className="flex size-12 items-center justify-center rounded-xl bg-muted/50">
-                <Layers className="size-5 text-muted-foreground/40" />
-              </div>
-              <div className="space-y-1">
-                <p className="text-sm font-medium text-foreground/70">
-                  Nenhuma sessão
-                </p>
-                <p className="text-xs text-muted-foreground leading-relaxed max-w-45">
-                  Adicione a primeira sessão para começar a organizar o conteúdo
-                  do curso.
-                </p>
-              </div>
-              <Button
-                size="sm"
-                variant="outline"
-                className="h-7 text-xs gap-1.5 mt-1"
-                disabled={createSession.isPending}
-                onClick={() => createSession.mutate()}
-              >
-                {createSession.isPending ? (
-                  <Loader2 className="size-3 animate-spin" />
-                ) : (
-                  <Plus className="size-3" />
-                )}
-                Nova sessão
-              </Button>
-            </div>
-          )}
-
-          {isEmpty && isSearchActive && (
-            <div className="flex flex-col items-center justify-center gap-2 py-12 px-4 text-center">
-              <SearchX className="size-8 text-muted-foreground/40" />
-              <p className="text-sm text-muted-foreground">
-                Nenhum resultado para &ldquo;{filterQuery.trim()}&rdquo;
-              </p>
-            </div>
-          )}
-
-          {/* Scrollable flat list */}
-          {!isEmpty && (
-            <div className="overflow-y-auto flex-1 min-h-0 px-1 py-1 space-y-px">
-              {items.map((item) => (
-                <div
-                  key={`${item.type}:${item.id}`}
-                  style={{ height: `${ROW_HEIGHT[item.type]}px` }}
-                >
-                  <SortableTreeRow
-                    item={item}
-                    isActive={
-                      activeItemId === item.id && activeItemType === item.type
-                    }
-                    isSelected={selectedIds.has(`${item.type}:${item.id}`)}
-                    query={filterQuery}
-                    isMatched={matchedIds.has(item.id)}
-                    isEffectivelyExpanded={
-                      expandedIds.has(item.id) || expandedBySearch.has(item.id)
-                    }
-                    lessonCountMap={lessonCountMap}
-                    visibleItems={items}
-                    dragDisabled={dragDisabled}
-                  />
+          <TreeRootContextMenu>
+            <div className="flex-1 min-h-0">
+              {/* Empty state */}
+              {isEmpty && !isSearchActive && (
+                <div className="flex flex-col items-center justify-center gap-3 py-12 px-4 text-center h-full">
+                  <div className="flex size-12 items-center justify-center rounded-xl bg-muted/50">
+                    <Layers className="size-5 text-muted-foreground/40" />
+                  </div>
+                  <div className="space-y-1">
+                    <p className="text-sm font-medium text-foreground/70">
+                      Nenhuma sessão
+                    </p>
+                    <p className="text-xs text-muted-foreground leading-relaxed max-w-45">
+                      Adicione a primeira sessão para começar a organizar o
+                      conteúdo do curso.
+                    </p>
+                  </div>
+                  <Button
+                    size="sm"
+                    variant="outline"
+                    className="h-7 text-xs gap-1.5 mt-1"
+                    disabled={createSession.isPending}
+                    onClick={() => createSession.mutate()}
+                  >
+                    {createSession.isPending ? (
+                      <Loader2 className="size-3 animate-spin" />
+                    ) : (
+                      <Plus className="size-3" />
+                    )}
+                    Nova sessão
+                  </Button>
+                </div>
+              )}
+
+              {isEmpty && isSearchActive && (
+                <div className="flex flex-col items-center justify-center gap-2 py-12 px-4 text-center h-full">
+                  <SearchX className="size-8 text-muted-foreground/40" />
+                  <p className="text-sm text-muted-foreground">
+                    Nenhum resultado para &ldquo;{filterQuery.trim()}&rdquo;
+                  </p>
                 </div>
-              ))}
+              )}
+
+              {/* Scrollable flat list */}
+              {!isEmpty && (
+                <div className="overflow-y-auto h-full px-1 py-1">
+                  <div className="flex min-h-full flex-col">
+                    <div className="space-y-px">
+                      {items.map((item) => (
+                        <div
+                          key={`${item.type}:${item.id}`}
+                          style={{ height: `${ROW_HEIGHT[item.type]}px` }}
+                        >
+                          <SortableTreeRow
+                            item={item}
+                            isActive={
+                              activeItemId === item.id &&
+                              activeItemType === item.type
+                            }
+                            isSelected={selectedIds.has(
+                              `${item.type}:${item.id}`
+                            )}
+                            query={filterQuery}
+                            isMatched={matchedIds.has(item.id)}
+                            isEffectivelyExpanded={
+                              expandedIds.has(item.id) ||
+                              expandedBySearch.has(item.id)
+                            }
+                            lessonCountMap={lessonCountMap}
+                            visibleItems={items}
+                            dragDisabled={dragDisabled}
+                          />
+                        </div>
+                      ))}
+                    </div>
+                    <div className="flex-1 min-h-12" />
+                  </div>
+                </div>
+              )}
             </div>
-          )}
+          </TreeRootContextMenu>
         </div>
       </SortableContext>