Merge branch 'main' into fix-web/asset-ref-icon

reearth · Oct 18, 2024 · 541e9c9 · 541e9c9
2 parents f5b7b78 + 803c54f
commit 541e9c9
Show file tree

Hide file tree

Showing 5 changed files with 59 additions and 1 deletion.
diff --git a/web/e2e/project/content/content.spec.ts b/web/e2e/project/content/content.spec.ts
@@ -79,6 +79,45 @@ test("Publishing and Unpublishing item has succeeded", async ({ page }) => {
   await expect(page.getByText("DRAFT")).toBeVisible();
 });
 
+test("Showing item title has succeeded", async ({ page }) => {
+  await page.locator("li").filter({ hasText: "Text" }).locator("div").first().click();
+  await handleFieldForm(page, "text");
+  await page.getByText("Content").click();
+  await page.getByRole("button", { name: "plus New Item" }).click();
+  await expect(page.getByTitle("e2e model name", { exact: true })).toBeVisible();
+  await page.getByLabel("text").click();
+  await page.getByLabel("text").fill("text");
+  await page.getByRole("button", { name: "Save" }).click();
+  await closeNotification(page);
+  const itemId = await page
+    .getByRole("main")
+    .locator("p")
+    .filter({ hasText: "ID" })
+    .locator("div > span")
+    .innerText();
+  await expect(page.getByTitle(`e2e model name / ${itemId}`, { exact: true })).toBeVisible();
+
+  await page.getByText("Schema").click();
+  await page.getByRole("img", { name: "ellipsis" }).locator("svg").click();
+  await page.getByLabel("Use as title").check();
+  await page.getByRole("tab", { name: "Default value" }).click();
+  await page.getByLabel("Set default value").click();
+  await page.getByLabel("Set default value").fill("default text");
+  await page.getByRole("button", { name: "OK" }).click();
+  await closeNotification(page);
+
+  await page.getByText("Content").click();
+  await page.getByRole("cell").getByLabel("edit").locator("svg").click();
+  await expect(page.getByTitle(`e2e model name / text`, { exact: true })).toBeVisible();
+  await page.getByLabel("Back").click();
+
+  await page.getByRole("button", { name: "plus New Item" }).click();
+  await expect(page.getByTitle("e2e model name", { exact: true })).toBeVisible();
+  await page.getByRole("button", { name: "Save" }).click();
+  await closeNotification(page);
+  await expect(page.getByTitle(`e2e model name / default text`, { exact: true })).toBeVisible();
+});
+
 test("Comment CRUD on Content page has succeeded", async ({ page }) => {
   await page.locator("li").filter({ hasText: "Text" }).locator("div").first().click();
   await handleFieldForm(page, "text");

diff --git a/web/src/components/molecules/Content/Details/index.tsx b/web/src/components/molecules/Content/Details/index.tsx
@@ -27,6 +27,7 @@ type Props = {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   initialFormValues: Record<string, any>;
   initialMetaFormValues: Record<string, unknown>;
+  title: string;
   item?: Item;
   itemId?: string;
   itemLoading: boolean;
@@ -113,6 +114,7 @@ const ContentDetailsMolecule: React.FC<Props> = ({
   modelsMenu,
   initialFormValues,
   initialMetaFormValues,
+  title,
   item,
   itemId,
   itemLoading,
@@ -194,6 +196,7 @@ const ContentDetailsMolecule: React.FC<Props> = ({
           <NotFound />
         ) : (
           <ContentForm
+            title={title}
             item={item}
             linkItemModalTitle={linkItemModalTitle}
             linkItemModalTotalCount={linkItemModalTotalCount}

diff --git a/web/src/components/molecules/Content/Form/index.tsx b/web/src/components/molecules/Content/Form/index.tsx
@@ -40,6 +40,7 @@ import { DefaultField } from "./fields/FieldComponents";
 import { FIELD_TYPE_COMPONENT_MAP } from "./fields/FieldTypesMap";
 
 type Props = {
+  title: string;
   item?: Item;
   loadingReference: boolean;
   linkedItemsModalList?: FormItem[];
@@ -122,6 +123,7 @@ type Props = {
 };
 
 const ContentForm: React.FC<Props> = ({
+  title,
   item,
   loadingReference,
   linkedItemsModalList,
@@ -484,7 +486,7 @@ const ContentForm: React.FC<Props> = ({
         initialValues={initialFormValues}
         onValuesChange={handleValuesChange}>
         <PageHeader
-          title={model?.name}
+          title={title}
           onBack={onBack}
           extra={
             <>
@@ -724,6 +726,7 @@ const FormItemsWrapper = styled.div`
   max-height: calc(100% - 72px);
   overflow-y: auto;
   padding: 36px;
+  border-top: 1px solid #00000008;
 `;
 
 const SideBarWrapper = styled.div`

diff --git a/web/src/components/organisms/Project/Content/ContentDetails/hooks.ts b/web/src/components/organisms/Project/Content/ContentDetails/hooks.ts
@@ -576,6 +576,16 @@ export default () => {
     [checkIfItemIsReferenced],
   );
 
+  const title = useMemo(() => {
+    let result = currentModel?.name ?? "";
+    if (currentItem) {
+      const titleField = currentModel?.schema.fields.find(field => field.isTitle);
+      const titleValue = titleField && initialFormValues[titleField.id];
+      result += ` / ${titleValue || currentItem.id}`;
+    }
+    return result;
+  }, [currentItem, currentModel?.name, currentModel?.schema.fields, initialFormValues]);
+
   return {
     loadingReference,
     linkedItemsModalList,
@@ -585,6 +595,7 @@ export default () => {
     itemLoading,
     requestCreationLoading,
     currentModel,
+    title,
     currentItem,
     initialFormValues,
     initialMetaFormValues,

diff --git a/web/src/components/organisms/Project/Content/ContentDetails/index.tsx b/web/src/components/organisms/Project/Content/ContentDetails/index.tsx
@@ -17,6 +17,7 @@ const ContentDetails: React.FC = () => {
     itemId,
     itemLoading,
     currentModel,
+    title,
     currentItem,
     initialFormValues,
     initialMetaFormValues,
@@ -125,6 +126,7 @@ const ContentDetails: React.FC = () => {
           />
         ) : undefined
       }
+      title={title}
       item={currentItem}
       itemId={itemId}
       itemLoading={itemLoading}