chore: update prettier configuration for print width (#519)

* feat: update prettier configuration for print width * chore: apply code formatting to entire repository * fix: remove build files * fix: format issue --------- Co-authored-by: Meier Lukas <meierschlumpf@gmail.com>
2024-05-19 22:38:39 +02:00
parent 919161798e
commit f1b1ec59ec
234 changed files with 2444 additions and 5375 deletions
--- a/packages/widgets/src/notebook/component.tsx
+++ b/packages/widgets/src/notebook/component.tsx
@@ -4,15 +4,10 @@ import "@mantine/tiptap/styles.css";

 import type { WidgetComponentProps } from "../definition";

-const Notebook = dynamic(
-  () => import("./notebook").then((module) => module.Notebook),
-  {
-    ssr: false,
-  },
-);
+const Notebook = dynamic(() => import("./notebook").then((module) => module.Notebook), {
+  ssr: false,
+});

-export default function NotebookWidget(
-  props: WidgetComponentProps<"notebook">,
-) {
+export default function NotebookWidget(props: WidgetComponentProps<"notebook">) {
  return <Notebook {...props} />;
 }
--- a/packages/widgets/src/notebook/index.ts
+++ b/packages/widgets/src/notebook/index.ts
@@ -4,27 +4,24 @@ import { createWidgetDefinition } from "../definition";
 import { optionsBuilder } from "../options";
 import { defaultContent } from "./default-content";

-export const { definition, componentLoader } = createWidgetDefinition(
-  "notebook",
-  {
-    icon: IconNotes,
-    options: optionsBuilder.from(
-      (factory) => ({
-        showToolbar: factory.switch({
-          defaultValue: true,
-        }),
-        allowReadOnlyCheck: factory.switch({
-          defaultValue: true,
-        }),
-        content: factory.text({
-          defaultValue: defaultContent,
-        }),
+export const { definition, componentLoader } = createWidgetDefinition("notebook", {
+  icon: IconNotes,
+  options: optionsBuilder.from(
+    (factory) => ({
+      showToolbar: factory.switch({
+        defaultValue: true,
      }),
-      {
-        content: {
-          shouldHide: () => true, // Hide the content option as it can be modified in the editor
-        },
+      allowReadOnlyCheck: factory.switch({
+        defaultValue: true,
+      }),
+      content: factory.text({
+        defaultValue: defaultContent,
+      }),
+    }),
+    {
+      content: {
+        shouldHide: () => true, // Hide the content option as it can be modified in the editor
      },
-    ),
-  },
-).withDynamicImport(() => import("./component"));
+    },
+  ),
+}).withDynamicImport(() => import("./component"));
--- a/packages/widgets/src/notebook/notebook.tsx
+++ b/packages/widgets/src/notebook/notebook.tsx
@@ -16,11 +16,7 @@ import {
  useMantineTheme,
 } from "@mantine/core";
 import { useDisclosure } from "@mantine/hooks";
-import {
-  Link,
-  RichTextEditor,
-  useRichTextEditorContext,
-} from "@mantine/tiptap";
+import { Link, RichTextEditor, useRichTextEditorContext } from "@mantine/tiptap";
 import {
  IconCheck,
  IconCircleOff,
@@ -78,12 +74,7 @@ const controlIconProps = {
  stroke: 1.5,
 };

-export function Notebook({
-  options,
-  isEditMode,
-  boardId,
-  itemId,
-}: WidgetComponentProps<"notebook">) {
+export function Notebook({ options, isEditMode, boardId, itemId }: WidgetComponentProps<"notebook">) {
  const [content, setContent] = useState(options.content);
  const [toSaveContent, setToSaveContent] = useState(content);

@@ -137,12 +128,9 @@ export function Notebook({
              backgroundColor: {
                default: undefined,
                renderHTML: (attributes) => ({
-                  style: attributes.backgroundColor
-                    ? `background-color: ${attributes.backgroundColor}`
-                    : undefined,
+                  style: attributes.backgroundColor ? `background-color: ${attributes.backgroundColor}` : undefined,
                }),
-                parseHTML: (element) =>
-                  element.style.backgroundColor || undefined,
+                parseHTML: (element) => element.style.backgroundColor || undefined,
              },
            };
          },
@@ -178,9 +166,7 @@ export function Notebook({
    [toSaveContent],
  );

-  const handleOnReadOnlyCheck = (
-    event: CustomEventInit<{ node: Node; checked: boolean }>,
-  ) => {
+  const handleOnReadOnlyCheck = (event: CustomEventInit<{ node: Node; checked: boolean }>) => {
    if (!options.allowReadOnlyCheck) return;
    if (!editor) return;

@@ -251,8 +237,7 @@ export function Notebook({
            "& .ProseMirror": {
              padding: "0  !important",
            },
-            backgroundColor:
-              colorScheme === "dark" ? theme.colors.dark[6] : "white",
+            backgroundColor: colorScheme === "dark" ? theme.colors.dark[6] : "white",
            border: "none",
            borderRadius: "0.5rem",
            display: "flex",
@@ -270,8 +255,7 @@ export function Notebook({
      >
        <RichTextEditor.Toolbar
          style={{
-            display:
-              isEditing && options.showToolbar === true ? "flex" : "none",
+            display: isEditing && options.showToolbar === true ? "flex" : "none",
          }}
        >
          <RichTextEditor.ControlsGroup>
@@ -319,9 +303,7 @@ export function Notebook({
            <RichTextEditor.BulletList title={tControls("bulletList")} />
            <RichTextEditor.OrderedList title={tControls("orderedList")} />
            <TaskListToggle />
-            {(editor?.isActive("taskList") ||
-              editor?.isActive("bulletList") ||
-              editor?.isActive("orderedList")) && (
+            {(editor?.isActive("taskList") || editor?.isActive("bulletList") || editor?.isActive("orderedList")) && (
              <>
                <ListIndentIncrease />
                <ListIndentDecrease />
@@ -368,9 +350,7 @@ export function Notebook({
      {enabled && (
        <>
          <ActionIcon
-            title={
-              isEditing ? t("common.action.save") : t("common.action.edit")
-            }
+            title={isEditing ? t("common.action.save") : t("common.action.edit")}
            style={{
              zIndex: 1,
            }}
@@ -383,11 +363,7 @@ export function Notebook({
            radius={"md"}
            onClick={handleEditToggle}
          >
-            {isEditing ? (
-              <IconDeviceFloppy {...iconProps} />
-            ) : (
-              <IconEdit {...iconProps} />
-            )}
+            {isEditing ? <IconDeviceFloppy {...iconProps} /> : <IconEdit {...iconProps} />}
          </ActionIcon>
          {isEditing && (
            <ActionIcon
@@ -482,9 +458,7 @@ function ColorCellControl() {
  const { editor } = useRichTextEditorContext();

  const getCurrent = useCallback(() => {
-    return editor?.getAttributes("tableCell").backgroundColor as
-      | string
-      | undefined;
+    return editor?.getAttributes("tableCell").backgroundColor as string | undefined;
  }, [editor]);

  const update = useCallback(
@@ -513,13 +487,7 @@ interface ColorControlProps {
  ariaLabel: string;
 }

-const ColorControl = ({
-  defaultColor,
-  getCurrent,
-  update,
-  icon: Icon,
-  ariaLabel,
-}: ColorControlProps) => {
+const ColorControl = ({ defaultColor, getCurrent, update, icon: Icon, ariaLabel }: ColorControlProps) => {
  const { editor } = useRichTextEditorContext();
  const [color, setColor] = useState(defaultColor);
  const { colors, white } = useMantineTheme();
@@ -591,33 +559,15 @@ const ColorControl = ({
      </Popover.Target>
      <Popover.Dropdown>
        <Stack gap={8}>
-          <ColorPicker
-            value={color}
-            onChange={setColor}
-            format="hexa"
-            swatches={palette}
-            swatchesPerRow={6}
-          />
+          <ColorPicker value={color} onChange={setColor} format="hexa" swatches={palette} swatchesPerRow={6} />
          <Group justify="right" gap={8}>
-            <ActionIcon
-              title={t("common.action.cancel")}
-              variant="default"
-              onClick={close}
-            >
+            <ActionIcon title={t("common.action.cancel")} variant="default" onClick={close}>
              <IconX stroke={1.5} size="1rem" />
            </ActionIcon>
-            <ActionIcon
-              title={t("common.action.apply")}
-              variant="default"
-              onClick={handleApplyColor}
-            >
+            <ActionIcon title={t("common.action.apply")} variant="default" onClick={handleApplyColor}>
              <IconCheck stroke={1.5} size="1rem" />
            </ActionIcon>
-            <ActionIcon
-              title={t("widget.notebook.popover.clearColor")}
-              variant="default"
-              onClick={handleClearColor}
-            >
+            <ActionIcon title={t("widget.notebook.popover.clearColor")} variant="default" onClick={handleClearColor}>
              <IconCircleOff stroke={1.5} size="1rem" />
            </ActionIcon>
          </Group>
@@ -676,11 +626,7 @@ function EmbedImage() {
      trapFocus
    >
      <Popover.Target>
-        <RichTextEditor.Control
-          onClick={toggle}
-          title={tControls("image")}
-          active={editor?.isActive("image")}
-        >
+        <RichTextEditor.Control onClick={toggle} title={tControls("image")} active={editor?.isActive("image")}>
          <IconPhoto stroke={1.5} size="1rem" />
        </RichTextEditor.Control>
      </Popover.Target>
@@ -777,11 +723,7 @@ const handleAddColumnBefore = (editor: Editor) => {
 };

 const TableAddColumnBefore = () => (
-  <TableControl
-    title="addColumnLeft"
-    onClick={handleAddColumnBefore}
-    icon={IconColumnInsertLeft}
-  />
+  <TableControl title="addColumnLeft" onClick={handleAddColumnBefore} icon={IconColumnInsertLeft} />
 );

 const handleAddColumnAfter = (editor: Editor) => {
@@ -789,11 +731,7 @@ const handleAddColumnAfter = (editor: Editor) => {
 };

 const TableAddColumnAfter = () => (
-  <TableControl
-    title="addColumnRight"
-    onClick={handleAddColumnAfter}
-    icon={IconColumnInsertRight}
-  />
+  <TableControl title="addColumnRight" onClick={handleAddColumnAfter} icon={IconColumnInsertRight} />
 );

 const handleRemoveColumn = (editor: Editor) => {
@@ -801,54 +739,31 @@ const handleRemoveColumn = (editor: Editor) => {
 };

 const TableRemoveColumn = () => (
-  <TableControl
-    title="deleteColumn"
-    onClick={handleRemoveColumn}
-    icon={IconColumnRemove}
-  />
+  <TableControl title="deleteColumn" onClick={handleRemoveColumn} icon={IconColumnRemove} />
 );

 const handleAddRowBefore = (editor: Editor) => {
  editor.commands.addRowBefore();
 };

-const TableAddRowBefore = () => (
-  <TableControl
-    title="addRowTop"
-    onClick={handleAddRowBefore}
-    icon={IconRowInsertTop}
-  />
-);
+const TableAddRowBefore = () => <TableControl title="addRowTop" onClick={handleAddRowBefore} icon={IconRowInsertTop} />;

 const handleAddRowAfter = (editor: Editor) => {
  editor.commands.addRowAfter();
 };

 const TableAddRowAfter = () => (
-  <TableControl
-    title="addRowBelow"
-    onClick={handleAddRowAfter}
-    icon={IconRowInsertBottom}
-  />
+  <TableControl title="addRowBelow" onClick={handleAddRowAfter} icon={IconRowInsertBottom} />
 );

 const handleRemoveRow = (editor: Editor) => {
  editor.commands.deleteRow();
 };

-const TableRemoveRow = () => (
-  <TableControl
-    title="deleteRow"
-    onClick={handleRemoveRow}
-    icon={IconRowRemove}
-  />
-);
+const TableRemoveRow = () => <TableControl title="deleteRow" onClick={handleRemoveRow} icon={IconRowRemove} />;

 interface TableControlProps {
-  title: Exclude<
-    keyof TranslationObject["widget"]["notebook"]["controls"],
-    "align" | "heading"
-  >;
+  title: Exclude<keyof TranslationObject["widget"]["notebook"]["controls"], "align" | "heading">;
  onClick: (editor: Editor) => void;
  icon: TablerIcon;
 }
@@ -862,10 +777,7 @@ const TableControl = ({ title, onClick, icon: Icon }: TableControlProps) => {
  }, [editor, onClick]);

  return (
-    <RichTextEditor.Control
-      title={tControls(title)}
-      onClick={handleControlClick}
-    >
+    <RichTextEditor.Control title={tControls(title)} onClick={handleControlClick}>
      <Icon {...controlIconProps} />
    </RichTextEditor.Control>
  );
@@ -958,26 +870,14 @@ function TableToggle() {
          active={isActive}
          onClick={handleControlClick}
        >
-          {isActive ? (
-            <IconTableOff stroke={1.5} size="1rem" />
-          ) : (
-            <IconTablePlus stroke={1.5} size="1rem" />
-          )}
+          {isActive ? <IconTableOff stroke={1.5} size="1rem" /> : <IconTablePlus stroke={1.5} size="1rem" />}
        </RichTextEditor.Control>
      </Popover.Target>
      <Popover.Dropdown>
        <form onSubmit={form.onSubmit(handleSubmit)}>
          <Stack gap={5}>
-            <NumberInput
-              label={t("widget.notebook.popover.columns")}
-              min={1}
-              {...form.getInputProps("cols")}
-            />
-            <NumberInput
-              label={t("widget.notebook.popover.rows")}
-              min={1}
-              {...form.getInputProps("rows")}
-            />
+            <NumberInput label={t("widget.notebook.popover.columns")} min={1} {...form.getInputProps("cols")} />
+            <NumberInput label={t("widget.notebook.popover.rows")} min={1} {...form.getInputProps("rows")} />
            <Button type="submit" variant="default" mt={10} mb={5}>
              {t("common.action.insert")}
            </Button>