@multiplatform.one/backoffice 7.34.4 → 7.35.0

package/src/i18n/en.ts

@@ -7,10 +7,298 @@
  *   i18next.addResourceBundle("en", "backoffice", { shell: { title: "Admin" } }, true, true);
  */
 export const en = {
+  formBuilder: {
+    columnPosition: "{{section}}, column {{number}}",
+    drag: {
+      cancel: "Movement cancelled. {{card}} returned to {{column}}.",
+      lift: "Lifted {{card}} in {{column}}, position {{position}} of {{count}}. Use arrow keys to move, space to drop, escape to cancel.",
+      move: "Moved {{card}} to {{column}}, position {{position}} of {{count}}.",
+      drop: "Dropped {{card}} in {{column}}, position {{position}} of {{count}}.",
+    },
+    untitledSection: "Untitled section",
+    moveUp: "Move up",
+    moveDown: "Move down",
+    moveToSection: "Move to section: {{section}}",
+    delete: "Delete",
+    hide: "Hide",
+    details: "Details",
+    untitledTab: "Untitled tab",
+    addTab: "Add tab",
+    tabProperties: "Tab properties",
+    sectionProperties: "Section properties",
+    columnProperties: "Column properties",
+    addSection: "Add section",
+    emptyTitle: "This form has no fields",
+    emptyDescription: "Add a field to start building the form.",
+    addField: "Add field",
+    addFieldHere: "Add field",
+    addFieldToColumn: "Add field to {{column}}",
+    fieldCount_one: "{{count}} field",
+    fieldCount_other: "{{count}} fields",
+    addColumn: "Add column",
+    removeColumn: "Remove column",
+    addSectionBelow: "Add section below",
+    removeSection: "Remove section",
+    sectionMenu: "Menu for section {{section}}",
+    column: "Column {{number}}",
+    selectNamedField: "Select {{field}}",
+    required: "Required",
+    fieldError: "Field needs attention",
+    fieldMenu: "Menu for {{field}}",
+    editProperties: "Edit properties",
+    hidden: "Hidden",
+    readOnly: "Read Only",
+    dropHere: "Drop a field here",
+    deleteTitle: "Remove this form item?",
+    fieldTypes: "Field types",
+    typeCount_one: "{{count}} type",
+    typeCount_other: "{{count}} types",
+    search: "Search field types",
+    group: "Field group",
+    groups: {
+      all: "All",
+      standard: "Standard",
+      layout: "Layout",
+      advanced: "Advanced",
+    },
+    noTypes: "No matching field types",
+    addType: "Add {{type}} field",
+    noMeta: "No form metadata available",
+    validation: {
+      summary_one: "{{count}} field needs attention.",
+      summary_other: "{{count}} fields need attention.",
+      fieldnameRequired: "A fieldname is required.",
+      invalidFieldname: "Use lowercase letters, digits and underscores, starting with a letter.",
+      duplicateFieldname: "Fieldnames must be unique.",
+      labelRequired: "A label or fieldname is required.",
+      optionsRequired: "Options are required for this field type.",
+    },
+    noConnection: "No Frappe connection is available.",
+    saved: "Form layout saved",
+    saveFailed: "Unable to save the form layout.",
+    home: "Home",
+    title: "Customize Form",
+    customizeMode: "Saves through Customize Form",
+    doctypeMode: "Saves to DocType",
+    goToList: "Go to {{doctype}} list",
+    reload: "Reload",
+    properties: "Field properties",
+    behaviour: "Behaviour",
+    discardTitle: "Discard unsaved changes?",
+    discard: "Discard",
+    catalogError: "The DocType catalog could not be loaded. Enter a name below.",
+    noDoctypes: "No DocTypes available",
+    doctype: "DocType",
+    typedDoctype: "DocType name",
+    open: "Open form builder",
+    selectField: "Select a field to edit its properties",
+    label: "Label",
+    fieldname: "Fieldname",
+    fieldType: "Field Type",
+    optionsLabel: "Options",
+    default: "Default",
+    description: "Description",
+    mandatory: "Mandatory",
+    inListView: "In List View",
+    deleteFieldBody: "This field will be removed when you save.",
+    deleteBreakBody: "Fields will move into the neighbouring layout.",
+    editLayout: "Edit form layout",
+    options: {
+      data: "Optional format, such as Email, Phone or URL.",
+      code: "The syntax language, such as Python or JavaScript.",
+      html: "The HTML content to display.",
+      image: "The fieldname containing the image URL.",
+      currency: "The fieldname containing the currency.",
+      readOnly: "The fieldname whose value is displayed.",
+      link: "The target DocType name.",
+      dynamicLink: "The fieldname of the field containing the target DocType.",
+      table: "The child DocType name.",
+      select: "One option per line.",
+    },
+    fieldtypes: {
+      data: {
+        label: "Data",
+        description: "Single line text",
+      },
+      text: {
+        label: "Text",
+        description: "Multi-line text",
+      },
+      small_text: {
+        label: "Small Text",
+        description: "Short text block",
+      },
+      long_text: {
+        label: "Long Text",
+        description: "Long text block",
+      },
+      text_editor: {
+        label: "Text Editor",
+        description: "Rich text",
+      },
+      int: {
+        label: "Int",
+        description: "Whole number",
+      },
+      float: {
+        label: "Float",
+        description: "Decimal number",
+      },
+      currency: {
+        label: "Currency",
+        description: "Money amount",
+      },
+      percent: {
+        label: "Percent",
+        description: "Percentage",
+      },
+      check: {
+        label: "Check",
+        description: "Yes or no",
+      },
+      select: {
+        label: "Select",
+        description: "Fixed choice list",
+      },
+      link: {
+        label: "Link",
+        description: "Linked document",
+      },
+      date: {
+        label: "Date",
+        description: "Calendar date",
+      },
+      datetime: {
+        label: "Datetime",
+        description: "Date and time",
+      },
+      time: {
+        label: "Time",
+        description: "Time of day",
+      },
+      duration: {
+        label: "Duration",
+        description: "Elapsed time",
+      },
+      attach: {
+        label: "Attach",
+        description: "File upload",
+      },
+      attach_image: {
+        label: "Attach Image",
+        description: "Image upload",
+      },
+      phone: {
+        label: "Phone",
+        description: "Phone number",
+      },
+      password: {
+        label: "Password",
+        description: "Hidden secret",
+      },
+      rating: {
+        label: "Rating",
+        description: "Star rating",
+      },
+      tab_break: {
+        label: "Tab Break",
+        description: "New form tab",
+      },
+      section_break: {
+        label: "Section Break",
+        description: "New section",
+      },
+      column_break: {
+        label: "Column Break",
+        description: "New column",
+      },
+      heading: {
+        label: "Heading",
+        description: "Heading text",
+      },
+      html: {
+        label: "HTML",
+        description: "Static HTML",
+      },
+      image: {
+        label: "Image",
+        description: "Image from a field",
+      },
+      button: {
+        label: "Button",
+        description: "Form action",
+      },
+      fold: {
+        label: "Fold",
+        description: "Fold point",
+      },
+      attachment_gallery: {
+        label: "Attachment Gallery",
+        description: "Attachment gallery",
+      },
+      autocomplete: {
+        label: "Autocomplete",
+        description: "Suggested text",
+      },
+      barcode: {
+        label: "Barcode",
+        description: "Scannable code",
+      },
+      code: {
+        label: "Code",
+        description: "Source code",
+      },
+      color: {
+        label: "Color",
+        description: "Colour picker",
+      },
+      dynamic_link: {
+        label: "Dynamic Link",
+        description: "Link by field",
+      },
+      geolocation: {
+        label: "Geolocation",
+        description: "Map location",
+      },
+      html_editor: {
+        label: "HTML Editor",
+        description: "Editable HTML",
+      },
+      icon: {
+        label: "Icon",
+        description: "Icon picker",
+      },
+      json: {
+        label: "JSON",
+        description: "JSON data",
+      },
+      markdown_editor: {
+        label: "Markdown Editor",
+        description: "Markdown text",
+      },
+      read_only: {
+        label: "Read Only",
+        description: "Display value",
+      },
+      signature: {
+        label: "Signature",
+        description: "Drawn signature",
+      },
+      table: {
+        label: "Table",
+        description: "Child table",
+      },
+      table_multiselect: {
+        label: "Table MultiSelect",
+        description: "Multi-link table",
+      },
+    },
+  },
   shell: {
     title: "Backoffice",
     home: "Home",
     toggleSidebar: "Toggle sidebar",
+    navigation: "Navigation",
   },
   sidebar: {
     private: "Private",
@@ -49,11 +337,12 @@ export const en = {
   },
   userMenu: {
     label: "User menu",
-    sessionUnavailable: "Session not loaded",
+    logIn: "Log in",
+    authFailedTitle: "Account unavailable",
+    close: "Close",
+    authFailed: "Unable to complete sign-in or sign-out. Try again.",
     myProfile: "My Profile",
     mySettings: "My Settings",
-    sessionDefaults: "Session Defaults",
-    sessionDefaultsGap: "Not implemented yet",
     reload: "Reload",
     toggleTheme: "Toggle Theme",
     themeUnavailable: "Theme switching is unavailable on this platform",
@@ -246,6 +535,7 @@ export const en = {
     tags: "Tags",
     titleColumn: "Title",
     tools: {
+      groupBy: "Group by",
       quickFilters: "Quick filters",
       title: "Filter & sort",
     },

package/src/index.ts

@@ -26,6 +26,7 @@ export type {
   BackofficeActionContext,
   BackofficeActions,
   BackofficeAppearance,
+  BackofficeAuth,
   BackofficeConfig,
   BackofficeFrappeConfig,
   BackofficeProviderProps,
@@ -78,6 +79,7 @@ export {
   BACKOFFICE_VIEWS,
   createBackofficePaths,
   formPath,
+  formBuilderPath,
   homePath,
   isBackofficeView,
   listPath,
@@ -524,7 +526,7 @@ export { useAvailableViews, ViewHeader } from "./views/ViewHeader";
 export { useViewLabels, ViewSwitcherMenu } from "./views/ViewSwitcherMenu";
 export type { ViewSwitcherMenuProps } from "./views/ViewSwitcherMenu";
 export { deriveAvailableViews, isViewSupported } from "./views/viewAvailability";
-export type { DeriveAvailableViewsOptions } from "./views/viewAvailability";
+export type { DeriveAvailableViewsOptions, ViewSource } from "./views/viewAvailability";
 export type { ViewHeaderProps } from "./views/ViewHeader";
 export { parseReportFiltersParam, ReportView } from "./views/ReportView";
 export type { ReportViewProps } from "./views/ReportView";
@@ -612,3 +614,58 @@ export { ReportToolbar as DoctypeReportToolbar } from "./report/report-toolbar";
 export type { ReportToolbarProps as DoctypeReportToolbarProps } from "./report/report-toolbar";
 export { DoctypeReportView } from "./report/DoctypeReportView";
 export type { DoctypeReportViewProps } from "./report/DoctypeReportView";
+
+export {
+  fieldtypeCatalog,
+  holdsValue,
+  isBreakType,
+  isColumnBreak,
+  isSectionBreak,
+  isTabBreak,
+  needsOptions,
+  optionsHint,
+  addColumn,
+  addSection,
+  addTab,
+  canDeleteField,
+  fieldLocation,
+  fieldsFromLayout,
+  findField,
+  insertField,
+  layoutFromFields,
+  moveField,
+  moveFieldBy,
+  moveFieldToSection,
+  newFieldFromType,
+  removeColumn,
+  removeField,
+  removeSection,
+  removeTab,
+  FormBuilderScreen,
+  type FormBuilderScreenProps,
+  scrub as formBuilderScrub,
+  tabBoard,
+  updateBreak,
+  updateField,
+  validateLayout,
+  buildCustomizeFormPayload,
+  buildDoctypeSavePayload,
+  formBuilderFields,
+  formBuilderMode,
+  loadFormBuilderSource,
+  parseFormBuilderError,
+  saveFormBuilderLayout,
+  type BuilderFieldtype,
+  type BuilderMessage,
+  type BuilderColumn,
+  type BuilderDocField,
+  type BuilderField,
+  type BuilderFieldLocation,
+  type BuilderLayout,
+  type BuilderSection,
+  type BuilderTab,
+  type FormBuilderMode,
+  type FormBuilderError,
+  type FormBuilderSource,
+  type SaveFormBuilderLayoutOptions,
+} from "./formBuilder";

package/src/list/DoctypeListScreen.guest.screen.spec.tsx

@@ -11,6 +11,8 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { BackofficeProvider } from "../config/BackofficeProvider";
 import { createMemoryNavigator } from "../navigation/navigator";
 import { DoctypeListScreen } from "./DoctypeListScreen";
+import { ViewHeader } from "../views/ViewHeader";
+import { ImageView } from "../views/ImageView";
 
 const layout = vi.hoisted(() => ({ size: "wide" }));
 vi.mock("@multiplatform.one/theme", async (importOriginal) => ({
@@ -167,7 +169,9 @@ describe("DoctypeListScreen with DocType meta refused (LC-96)", () => {
       const content = region.firstElementChild?.firstElementChild as HTMLElement;
       expect(getComputedStyle(content).flexBasis).toBe("auto");
       expect(getComputedStyle(content).flexShrink).toBe("0");
-      expect(region.contains(screen.getByRole("heading", { name: doctype }))).toBe(false);
+      const heading = screen.queryByRole("heading", { name: doctype });
+      if (size === "wide") expect(heading).toBeTruthy();
+      if (heading) expect(region.contains(heading)).toBe(false);
     },
   );
 
@@ -213,7 +217,7 @@ describe("DoctypeListScreen with DocType meta refused (LC-96)", () => {
     const views = Array.from(document.querySelectorAll('[role="menuitemcheckbox"]')).map((node) =>
       node.textContent?.trim(),
     );
-    expect(views).toEqual(["List", "Report"]);
+    expect(views).toEqual(["List", "Report", "Image"]);
   });
 
   it("says the reader can't open the list when no row is readable, with no retry", async () => {
@@ -258,3 +262,60 @@ it("renders rows before a slow count settles", async () => {
     release();
   }
 });
+
+it.each(["report", "image", "dashboard"] as const)(
+  "offers the same Guest views from %s",
+  async (view) => {
+    renderWithProviders(
+      <BackofficeProvider
+        frappe={{ baseURL: `https://guest-header-${run}.spec.test` }}
+        navigation={createMemoryNavigator("/backoffice")}
+      >
+        <ViewHeader doctype={doctype} view={view} />
+      </BackofficeProvider>,
+    );
+    fireEvent.click(await screen.findByTestId("list-view-switcher", {}, settle));
+    await waitFor(() => {
+      const views = Array.from(document.querySelectorAll('[role="menuitemcheckbox"]')).map((node) =>
+        node.textContent?.trim(),
+      );
+      expect(views).toEqual(["List", "Report", "Image"]);
+    }, settle);
+  },
+);
+
+it("renders Guest image cards from readable records when metadata is refused", async () => {
+  renderWithProviders(
+    <BackofficeProvider
+      frappe={{ baseURL: `https://guest-image-${run}.spec.test` }}
+      navigation={createMemoryNavigator("/backoffice")}
+    >
+      <ImageView doctype={doctype} />
+    </BackofficeProvider>,
+  );
+  expect(await screen.findByTestId("pokemon-card-bulbasaur", {}, settle)).toBeTruthy();
+  expect(screen.queryByText("Couldn't load this view")).toBeNull();
+  const image = screen.getByTestId("pokemon-card-bulbasaur").querySelector("img")!;
+  expect(image.getAttribute("src")).toContain("/files/bulbasaur.png");
+});
+
+it("keeps a denied Image read distinct from a broken metadata request", async () => {
+  rowsReadable = false;
+  const renderImage = () =>
+    renderWithProviders(
+      <BackofficeProvider
+        frappe={{ baseURL: `https://guest-image-state-${run}.spec.test` }}
+        navigation={createMemoryNavigator("/backoffice")}
+      >
+        <ImageView doctype={doctype} />
+      </BackofficeProvider>,
+    );
+  const denied = renderImage();
+  expect(await screen.findByText("You can't open the Pokemon image view", {}, settle)).toBeTruthy();
+  denied.unmount();
+  run += 1;
+  metaAnswer = "broken";
+  renderImage();
+  expect(await screen.findByText("Couldn't load this view", {}, settle)).toBeTruthy();
+  expect(screen.getByText("Pokemon is being migrated")).toBeTruthy();
+});