Added break block

This commit is contained in:
DrMint 2024-03-15 21:19:23 +01:00
parent 316703c631
commit 14622450cf
7 changed files with 108 additions and 18 deletions

20
src/blocks/breakBlock.ts Normal file
View File

@ -0,0 +1,20 @@
import { Block } from "payload/types";
import { BreakBlockType } from "../constants";
export const breakBlock: Block = {
slug: "breakBlock",
interfaceName: "BreakBlock",
labels: { singular: "Break", plural: "Breaks" },
fields: [
{
name: "type",
type: "radio",
required: true,
defaultValue: BreakBlockType.sceneBreak,
options: Object.entries(BreakBlockType).map(([_, value]) => ({
label: value,
value: value,
})),
},
],
};

View File

@ -1,5 +1,6 @@
import { Block } from "payload/types"; import { Block } from "payload/types";
import { createEditor } from "../utils/editor"; import { createEditor } from "../utils/editor";
import { breakBlock } from "./breakBlock";
import { transcriptBlock } from "./transcriptBlock"; import { transcriptBlock } from "./transcriptBlock";
const generateRecursiveSectionBlock = (depth = 1, maxDepth = 5): Block => ({ const generateRecursiveSectionBlock = (depth = 1, maxDepth = 5): Block => ({
@ -25,6 +26,7 @@ const generateRecursiveSectionBlock = (depth = 1, maxDepth = 5): Block => ({
blocks: [ blocks: [
...(depth < maxDepth ? [generateRecursiveSectionBlock(depth + 1, maxDepth)] : []), ...(depth < maxDepth ? [generateRecursiveSectionBlock(depth + 1, maxDepth)] : []),
transcriptBlock, transcriptBlock,
breakBlock
], ],
}), }),
}, },

View File

@ -1,4 +1,5 @@
import { Where } from "payload/types"; import { Where } from "payload/types";
import { breakBlock } from "../../blocks/breakBlock";
import { sectionBlock } from "../../blocks/sectionBlock"; import { sectionBlock } from "../../blocks/sectionBlock";
import { transcriptBlock } from "../../blocks/transcriptBlock"; import { transcriptBlock } from "../../blocks/transcriptBlock";
import { QuickFilters, publishStatusFilters } from "../../components/QuickFilters"; import { QuickFilters, publishStatusFilters } from "../../components/QuickFilters";
@ -150,7 +151,7 @@ export const Pages = buildVersionedCollectionConfig({
images: true, images: true,
inlines: true, inlines: true,
alignment: true, alignment: true,
blocks: [sectionBlock, transcriptBlock], blocks: [sectionBlock, transcriptBlock, breakBlock],
links: true, links: true,
lists: true, lists: true,
}), }),

View File

@ -1,7 +1,9 @@
import { import {
BreakBlockType,
Collections, Collections,
PageType, PageType,
RichTextContent, RichTextContent,
isBlockNodeBreakBlock,
isBlockNodeSectionBlock, isBlockNodeSectionBlock,
isNodeBlockNode, isNodeBlockNode,
} from "../../../constants"; } from "../../../constants";
@ -78,15 +80,58 @@ const handleContent = (
}; };
}; };
const handleToc = (content: RichTextContent, parentPrefix = ""): TableOfContentEntry[] => const handleToc = (content: RichTextContent, parentPrefix = ""): TableOfContentEntry[] => {
content.root.children let index = 0;
.filter(isNodeBlockNode)
.filter(isBlockNodeSectionBlock) return content.root.children.filter(isNodeBlockNode).flatMap<TableOfContentEntry>((node) => {
.map(({ fields }, index) => ({ if (isBlockNodeSectionBlock(node)) {
prefix: `${parentPrefix}${index + 1}.`, index++;
title: fields.blockName ?? "", return [
children: handleToc(fields.content, `${index + 1}.`), {
})); index,
prefix: `${parentPrefix}${index}.`,
title: node.fields.blockName ?? "",
type: "section",
children: handleToc(node.fields.content, `${index}.`),
},
];
} else if (isBlockNodeBreakBlock(node)) {
switch (node.fields.type) {
case BreakBlockType.dottedLine:
case BreakBlockType.solidLine: {
index++;
return [
{
index,
prefix: `${parentPrefix}${index}.`,
title: node.fields.blockName ?? "",
type: "break",
children: [],
},
];
}
case BreakBlockType.sceneBreak: {
index++;
return [
{
index,
prefix: `${parentPrefix}${index}.`,
title: node.fields.blockName ?? "",
type: "sceneBreak",
children: [],
},
];
}
case BreakBlockType.space:
default:
return [];
}
}
return [];
});
};
export const convertPageToPreview = ({ export const convertPageToPreview = ({
authors, authors,

View File

@ -1,8 +1,4 @@
import type { import type { BreakBlock, Image, SectionBlock, TranscriptBlock } from "./types/collections";
Image,
SectionBlock,
TranscriptBlock,
} from "./types/collections";
// END MOCKING SECTION // END MOCKING SECTION
@ -45,6 +41,13 @@ export enum LanguageCodes {
"zh" = "Chinese", "zh" = "Chinese",
} }
export enum BreakBlockType {
sceneBreak = "Scene break",
space = "Empty space",
solidLine = "Solid line",
dottedLine = "Dotted line",
}
export enum CollectibleBindingTypes { export enum CollectibleBindingTypes {
Paperback = "Paperback", Paperback = "Paperback",
Hardcover = "Hardcover", Hardcover = "Hardcover",
@ -202,6 +205,10 @@ export interface RichTextTranscriptBlock extends RichTextBlockNode {
fields: TranscriptBlock; fields: TranscriptBlock;
} }
export interface RichTextBreakBlock extends RichTextBlockNode {
fields: BreakBlock;
}
export const isNodeParagraphNode = (node: RichTextNode): node is RichTextParagraphNode => export const isNodeParagraphNode = (node: RichTextNode): node is RichTextParagraphNode =>
node.type === "paragraph"; node.type === "paragraph";
@ -251,19 +258,22 @@ export const isBlockNodeTranscriptBlock = (
node: RichTextBlockNode node: RichTextBlockNode
): node is RichTextTranscriptBlock => node.fields.blockType === "transcriptBlock"; ): node is RichTextTranscriptBlock => node.fields.blockType === "transcriptBlock";
export const isBlockNodeBreakBlock = (node: RichTextBlockNode): node is RichTextBreakBlock =>
node.fields.blockType === "breakBlock";
/* BLOCKS */ /* BLOCKS */
/* TODO: TO BE REMOVED WHEN https://github.com/payloadcms/payload/issues/5216 is closed */ /* TODO: TO BE REMOVED WHEN https://github.com/payloadcms/payload/issues/5216 is closed */
export interface CueBlock { export interface CueBlock {
content: RichTextContent; content: RichTextContent;
blockType: 'cueBlock'; blockType: "cueBlock";
id?: string | null; id?: string | null;
blockName?: string | null; blockName?: string | null;
} }
export interface LineBlock { export interface LineBlock {
content: RichTextContent; content: RichTextContent;
blockType: 'lineBlock'; blockType: "lineBlock";
id?: string | null; id?: string | null;
blockName?: string | null; blockName?: string | null;
} }

View File

@ -315,6 +315,8 @@ export type EndpointCollectible = EndpointCollectiblePreview & {
export type TableOfContentEntry = { export type TableOfContentEntry = {
prefix: string; prefix: string;
title: string; title: string;
type: "sceneBreak" | "break" | "section";
index: number;
children: TableOfContentEntry[]; children: TableOfContentEntry[];
}; };

View File

@ -805,6 +805,16 @@ export interface TranscriptBlock {
blockName?: string | null; blockName?: string | null;
blockType: 'transcriptBlock'; blockType: 'transcriptBlock';
} }
/**
* This interface was referenced by `Config`'s JSON-Schema
* via the `definition` "BreakBlock".
*/
export interface BreakBlock {
type: 'Scene break' | 'Empty space' | 'Solid line' | 'Dotted line';
id?: string | null;
blockName?: string | null;
blockType: 'breakBlock';
}
/** /**
* This interface was referenced by `Config`'s JSON-Schema * This interface was referenced by `Config`'s JSON-Schema
* via the `definition` "SectionBlock". * via the `definition` "SectionBlock".