@carlonicora/nextjs-jsonapi 1.68.0 → 1.69.0

package/src/features/how-to/contexts/HowToContext.tsx

@@ -0,0 +1,101 @@
+"use client";
+
+import { JsonApiHydratedDataInterface, Modules, rehydrate } from "../../../core";
+import { BreadcrumbItemData } from "../../../interfaces";
+import { usePageUrlGenerator } from "../../../hooks";
+import { SharedProvider } from "../../../contexts/SharedContext";
+import { HowToInterface } from "../data/HowToInterface";
+import { HowToService } from "../data/HowToService";
+import HowToDeleter from "../components/forms/HowToDeleter";
+import HowToEditor from "../components/forms/HowToEditor";
+import { useTranslations } from "next-intl";
+import { createContext, ReactNode, useContext, useState } from "react";
+
+interface HowToContextType {
+  howTo: HowToInterface | undefined;
+  setHowTo: (value: HowToInterface | undefined) => void;
+  reloadHowTo: () => Promise<void>;
+}
+
+const HowToContext = createContext<HowToContextType | undefined>(undefined);
+
+type HowToProviderProps = {
+  children: ReactNode;
+  dehydratedHowTo?: JsonApiHydratedDataInterface;
+};
+
+export const HowToProvider = ({ children, dehydratedHowTo }: HowToProviderProps) => {
+  const generateUrl = usePageUrlGenerator();
+  const t = useTranslations();
+
+  const [howTo, setHowTo] = useState<HowToInterface | undefined>(
+    dehydratedHowTo ? rehydrate<HowToInterface>(Modules.HowTo, dehydratedHowTo) : undefined,
+  );
+
+  const reloadHowTo = async () => {
+    if (!howTo) return;
+
+    const freshHowTo = await HowToService.findOne({ id: howTo.id });
+    setHowTo(freshHowTo);
+  };
+
+  const breadcrumb = () => {
+    const response: BreadcrumbItemData[] = [];
+
+    response.push({
+      name: t(`entities.howtos`, { count: 2 }),
+      href: generateUrl({ page: Modules.HowTo }),
+    });
+
+    if (howTo)
+      response.push({
+        name: howTo.name,
+        href: generateUrl({ page: Modules.HowTo, id: howTo.id }),
+      });
+
+    return response;
+  };
+
+  const title = () => {
+    const response: any = {
+      type: t(`entities.howtos`, { count: howTo ? 1 : 2 }),
+    };
+
+    const functions: ReactNode[] = [];
+
+    if (howTo) {
+      response.element = howTo.name;
+
+      functions.push(<HowToDeleter key={`HowToDeleter`} howTo={howTo} />);
+      functions.push(<HowToEditor key={`HowToEditor`} howTo={howTo} propagateChanges={setHowTo} />);
+    } else {
+      functions.push(<HowToEditor key={`HowToEditor`} />);
+    }
+
+    if (functions.length > 0) response.functions = functions;
+
+    return response;
+  };
+
+  return (
+    <SharedProvider value={{ breadcrumbs: breadcrumb(), title: title() }}>
+      <HowToContext.Provider
+        value={{
+          howTo: howTo,
+          setHowTo: setHowTo,
+          reloadHowTo: reloadHowTo,
+        }}
+      >
+        {children}
+      </HowToContext.Provider>
+    </SharedProvider>
+  );
+};
+
+export const useHowToContext = (): HowToContextType => {
+  const context = useContext(HowToContext);
+  if (context === undefined) {
+    throw new Error("useHowToContext must be used within a HowToProvider");
+  }
+  return context;
+};

package/src/features/how-to/data/HowTo.ts

@@ -0,0 +1,69 @@
+import { JsonApiHydratedDataInterface, Modules } from "../../../core";
+import { Content } from "../../content/data/content";
+import { HowToInput, HowToInterface } from "./HowToInterface";
+
+export class HowTo extends Content implements HowToInterface {
+  private _description?: any;
+  private _pages?: string;
+
+  /**
+   * Parse pages from backend JSON string (handles legacy single string + JSON array)
+   */
+  static parsePagesFromString(pagesStr?: string): string[] {
+    if (!pagesStr) return [];
+    try {
+      const parsed = JSON.parse(pagesStr);
+      return Array.isArray(parsed) ? parsed : [pagesStr];
+    } catch {
+      // Legacy: treat as single page if not valid JSON
+      return pagesStr ? [pagesStr] : [];
+    }
+  }
+
+  /**
+   * Serialize pages array to JSON string for backend
+   */
+  static serializePagesToString(pages: string[]): string | undefined {
+    const filtered = pages.filter((p) => p.trim());
+    return filtered.length > 0 ? JSON.stringify(filtered) : undefined;
+  }
+
+  get description(): any {
+    return this._description;
+  }
+
+  get pages(): string | undefined {
+    return this._pages;
+  }
+
+  rehydrate(data: JsonApiHydratedDataInterface): this {
+    super.rehydrate(data);
+
+    this._description = data.jsonApi.attributes.description
+      ? JSON.parse(data.jsonApi.attributes.description)
+      : undefined;
+    this._pages = data.jsonApi.attributes.pages;
+
+    return this;
+  }
+
+  createJsonApi(data: HowToInput) {
+    const response: any = {
+      data: {
+        type: Modules.HowTo.name,
+        id: data.id,
+        attributes: {},
+        meta: {},
+        relationships: {},
+      },
+      included: [],
+    };
+
+    super.addContentInput(response, data);
+
+    if (data.description !== undefined) response.data.attributes.description = JSON.stringify(data.description);
+    if (data.pages !== undefined) response.data.attributes.pages = data.pages;
+
+    return response;
+  }
+}

package/src/features/how-to/data/HowToFields.ts

@@ -0,0 +1,10 @@
+export enum HowToFields {
+  howToId = "howToId",
+
+  name = "name",
+  description = "description",
+  pages = "pages",
+
+  createdAt = "createdAt",
+  updatedAt = "updatedAt",
+}

package/src/features/how-to/data/HowToInterface.ts

@@ -0,0 +1,11 @@
+import { ContentInput, ContentInterface } from "../../content/data/content.interface";
+
+export type HowToInput = ContentInput & {
+  description?: any;
+  pages?: string | undefined | null;
+};
+
+export interface HowToInterface extends ContentInterface {
+  get description(): any;
+  get pages(): string | undefined;
+}

package/src/features/how-to/data/HowToService.ts

@@ -0,0 +1,61 @@
+import { AbstractService, EndpointCreator, HttpMethod, Modules, NextRef, PreviousRef } from "../../../core";
+import { HowToInput, HowToInterface } from "./HowToInterface";
+
+export class HowToService extends AbstractService {
+  static async findOne(params: { id: string }): Promise<HowToInterface> {
+    return this.callApi<HowToInterface>({
+      type: Modules.HowTo,
+      method: HttpMethod.GET,
+      endpoint: new EndpointCreator({ endpoint: Modules.HowTo, id: params.id }).generate(),
+    });
+  }
+
+  static async findMany(
+    params: {
+      search?: string;
+      fetchAll?: boolean;
+      next?: NextRef;
+      prev?: PreviousRef;
+    } = {},
+  ): Promise<HowToInterface[]> {
+    const endpoint = new EndpointCreator({ endpoint: Modules.HowTo });
+
+    if (params.fetchAll) endpoint.addAdditionalParam("fetchAll", "true");
+    if (params.search) endpoint.addAdditionalParam("search", params.search);
+    if (Modules.HowTo.inclusions?.lists?.fields) endpoint.limitToFields(Modules.HowTo.inclusions.lists.fields);
+    if (Modules.HowTo.inclusions?.lists?.types) endpoint.limitToType(Modules.HowTo.inclusions.lists.types);
+
+    return this.callApi({
+      type: Modules.HowTo,
+      method: HttpMethod.GET,
+      endpoint: endpoint.generate(),
+      next: params.next,
+    });
+  }
+
+  static async create(params: HowToInput): Promise<HowToInterface> {
+    return this.callApi({
+      type: Modules.HowTo,
+      method: HttpMethod.POST,
+      endpoint: new EndpointCreator({ endpoint: Modules.HowTo }).generate(),
+      input: params,
+    });
+  }
+
+  static async update(params: HowToInput): Promise<HowToInterface> {
+    return this.callApi({
+      type: Modules.HowTo,
+      method: HttpMethod.PUT,
+      endpoint: new EndpointCreator({ endpoint: Modules.HowTo, id: params.id }).generate(),
+      input: params,
+    });
+  }
+
+  static async delete(params: { howToId: string }): Promise<void> {
+    await this.callApi({
+      type: Modules.HowTo,
+      method: HttpMethod.DELETE,
+      endpoint: new EndpointCreator({ endpoint: Modules.HowTo, id: params.howToId }).generate(),
+    });
+  }
+}

package/src/features/how-to/data/index.ts

@@ -0,0 +1,4 @@
+export * from "./HowTo";
+export * from "./HowToFields";
+export * from "./HowToInterface";
+export * from "./HowToService";

package/src/features/how-to/hooks/useHowToTableStructure.tsx

@@ -0,0 +1,86 @@
+"use client";
+
+import { ColumnDef } from "@tanstack/react-table";
+import { useTranslations } from "next-intl";
+import { useMemo } from "react";
+
+import { cellDate, cellId } from "../../../components";
+import { Modules } from "../../../core";
+import { registerTableGenerator, TableContent, usePageUrlGenerator, UseTableStructureHook } from "../../../hooks";
+import { Link } from "../../../shadcnui";
+import { HowToFields } from "../data/HowToFields";
+import { HowToInterface } from "../data/HowToInterface";
+
+export const useHowToTableStructure: UseTableStructureHook<HowToInterface, HowToFields> = (params) => {
+  const t = useTranslations();
+  const generateUrl = usePageUrlGenerator();
+
+  const tableData = useMemo(() => {
+    return params.data.map((howTo: HowToInterface) => {
+      const entry: TableContent<HowToInterface> = {
+        jsonApiData: howTo,
+      };
+      entry[HowToFields.howToId] = howTo.id;
+      params.fields.forEach((field) => {
+        entry[field] = howTo[field as keyof HowToInterface];
+      });
+      return entry;
+    });
+  }, [params.data, params.fields]);
+
+  const fieldColumnMap: Partial<Record<HowToFields, () => any>> = {
+    [HowToFields.howToId]: () =>
+      cellId({
+        name: "howToId",
+        checkedIds: params.checkedIds,
+        toggleId: params.toggleId,
+      }),
+    [HowToFields.name]: () => ({
+      id: "name",
+      accessorKey: "name",
+      header: t(`howto.fields.name.label`),
+      cell: ({ row }: { row: TableContent<HowToInterface> }) => {
+        const howTo: HowToInterface = row.original.jsonApiData;
+        return <Link href={generateUrl({ page: Modules.HowTo, id: howTo.id })}>{howTo.name}</Link>;
+      },
+      enableSorting: false,
+      enableHiding: false,
+    }),
+    [HowToFields.description]: () => ({
+      id: "description",
+      accessorKey: "description",
+      header: t(`howto.fields.description.label`),
+      cell: ({ row }: { row: TableContent<HowToInterface> }) => <>{row.getValue("description")}</>,
+      enableSorting: false,
+      enableHiding: false,
+    }),
+    [HowToFields.pages]: () => ({
+      id: "pages",
+      accessorKey: "pages",
+      header: t(`howto.fields.pages.label`),
+      cell: ({ row }: { row: TableContent<HowToInterface> }) => <>{row.getValue("pages")}</>,
+      enableSorting: false,
+      enableHiding: false,
+    }),
+    [HowToFields.createdAt]: () =>
+      cellDate({
+        name: "createdAt",
+        title: t(`common.date.create`),
+      }),
+    [HowToFields.updatedAt]: () =>
+      cellDate({
+        name: "updatedAt",
+        title: t(`common.date.update`),
+      }),
+  };
+
+  const columns = useMemo(() => {
+    return params.fields.map((field) => fieldColumnMap[field]?.()).filter((col) => col !== undefined) as ColumnDef<
+      TableContent<HowToInterface>
+    >[];
+  }, [params.fields, fieldColumnMap, t, generateUrl]);
+
+  return useMemo(() => ({ data: tableData, columns: columns }), [tableData, columns]);
+};
+
+registerTableGenerator("howtos", useHowToTableStructure);

package/src/features/how-to/index.ts

@@ -0,0 +1,2 @@
+export * from "./HowToModule";
+export * from "./data";

package/src/features/how-to/utils/blocknote.ts

@@ -0,0 +1,108 @@
+export type TocHeading = {
+  id: string;
+  text: string;
+  level: number;
+};
+
+/**
+ * Extracts all text content from a BlockNote block recursively
+ */
+function extractTextFromContent(content: any): string {
+  if (!content) return "";
+
+  if (typeof content === "string") return content;
+
+  if (Array.isArray(content)) {
+    return content.map(extractTextFromContent).join("");
+  }
+
+  if (content.text) return content.text;
+
+  if (content.content) {
+    return extractTextFromContent(content.content);
+  }
+
+  return "";
+}
+
+/**
+ * Extracts all text from BlockNote content for word counting
+ */
+export function extractAllText(blocks: any[] | undefined): string {
+  if (!blocks || !Array.isArray(blocks)) return "";
+
+  return blocks
+    .map((block) => {
+      let text = extractTextFromContent(block.content);
+
+      // Recursively get text from children blocks
+      if (block.children && Array.isArray(block.children)) {
+        text += " " + extractAllText(block.children);
+      }
+
+      return text;
+    })
+    .join(" ")
+    .trim();
+}
+
+/**
+ * Calculates estimated reading time based on word count
+ * Assumes average reading speed of 200 words per minute
+ */
+export function calculateReadingTime(blocks: any[] | undefined): number {
+  const text = extractAllText(blocks);
+  const wordCount = text.split(/\s+/).filter((word: string) => word.length > 0).length;
+  const minutes = Math.ceil(wordCount / 200);
+  return Math.max(1, minutes); // Minimum 1 minute
+}
+
+/**
+ * Generates a URL-friendly slug from text
+ */
+function generateSlug(text: string, index: number): string {
+  const baseSlug = text
+    .toLowerCase()
+    .replace(/[^a-z0-9\s-]/g, "")
+    .replace(/\s+/g, "-")
+    .replace(/-+/g, "-")
+    .trim();
+
+  return baseSlug || `heading-${index}`;
+}
+
+/**
+ * Extracts headings from BlockNote content for table of contents
+ */
+export function extractHeadings(blocks: any[] | undefined): TocHeading[] {
+  if (!blocks || !Array.isArray(blocks)) return [];
+
+  const headings: TocHeading[] = [];
+  let headingIndex = 0;
+
+  function processBlocks(blockArray: any[]) {
+    for (const block of blockArray) {
+      if (block.type === "heading") {
+        const level = block.props?.level || 1;
+        const text = extractTextFromContent(block.content);
+
+        if (text.trim()) {
+          headings.push({
+            id: generateSlug(text, headingIndex),
+            text: text.trim(),
+            level,
+          });
+          headingIndex++;
+        }
+      }
+
+      // Process children blocks recursively
+      if (block.children && Array.isArray(block.children)) {
+        processBlocks(block.children);
+      }
+    }
+  }
+
+  processBlocks(blocks);
+  return headings;
+}

package/src/features/how-to/utils/index.ts

@@ -0,0 +1 @@
+export * from "./blocknote";

package/dist/breadcrumb.item.data.interface-CgB4_1EE.d.mts

@@ -1,6 +0,0 @@
-type BreadcrumbItemData = {
-    name: string;
-    href?: string;
-};
-
-export type { BreadcrumbItemData as B };

package/dist/breadcrumb.item.data.interface-CgB4_1EE.d.ts

@@ -1,6 +0,0 @@
-type BreadcrumbItemData = {
-    name: string;
-    href?: string;
-};
-
-export type { BreadcrumbItemData as B };