From cf05804b4677782c589a65951f785ca4d5f832a7 Mon Sep 17 00:00:00 2001
From: adrians5j <adrian@webiny.com>
Date: Fri, 20 Dec 2024 06:25:06 +0100
Subject: [PATCH] fix: update example

---
 .../customCmsEntryFormLayout/package.json     | 15 +++++
 .../customCmsEntryFormLayout/src/index.tsx    | 67 +++++++++++++++++++
 .../customCmsEntryFormLayout/tsconfig.json    |  0
 .../customCmsEntryFormLayout/package.json     | 14 ----
 .../customCmsEntryFormLayout/src/index.tsx    | 57 ----------------
 5 files changed, 82 insertions(+), 71 deletions(-)
 create mode 100644 custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/package.json
 create mode 100644 custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/src/index.tsx
 rename custom-cms-entry-form-layout/{ => 5.41.x}/extensions/customCmsEntryFormLayout/tsconfig.json (100%)
 delete mode 100644 custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/package.json
 delete mode 100644 custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/src/index.tsx

diff --git a/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/package.json b/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/package.json
new file mode 100644
index 00000000..8649373b
--- /dev/null
+++ b/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/package.json
@@ -0,0 +1,15 @@
+{
+  "name": "custom-cms-entry-form-layout",
+  "main": "src/index.tsx",
+  "version": "1.0.0",
+  "keywords": [
+    "webiny-extension",
+    "webiny-extension-type:admin"
+  ],
+  "dependencies": {
+    "@webiny/app-serverless-cms": "0.0.0",
+    "@webiny/app-headless-cms": "0.0.0",
+    "@webiny/ui": "0.0.0",
+    "react": "18.2.0"
+  }
+}
diff --git a/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/src/index.tsx b/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/src/index.tsx
new file mode 100644
index 00000000..6f8b03e8
--- /dev/null
+++ b/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/src/index.tsx
@@ -0,0 +1,67 @@
+import React from "react";
+import { useSecurity } from "@webiny/app-serverless-cms";
+import { CmsContentFormRendererPlugin } from "@webiny/app-headless-cms";
+import { Grid, Cell } from "@webiny/ui/Grid";
+import { Tabs, Tab } from "@webiny/ui/Tabs";
+import { Alert } from "@webiny/ui/Alert";
+
+type CmsContentFormRendererProps = React.ComponentProps<typeof CmsContentFormRendererPlugin>;
+
+const PizzaLayout: CmsContentFormRendererProps["render"] = ({ fields, data }) => {
+    // Access security identity.
+    const { getPermission } = useSecurity();
+
+    // Get the necessary permission.
+    const bakeryPermission = getPermission("bakery");
+
+    // Check if the user has the permission to edit a recipe.
+    const canEditRecipe = bakeryPermission && bakeryPermission["canEditRecipe"] === true;
+
+    const priceTooLow = data["price"] < 20 && data["numberOfIngredients"] > 6;
+
+    return (
+        <Tabs>
+            <Tab label="General">
+                {priceTooLow && (
+                    <Grid>
+                        <Cell span={12}>
+                            <Alert type={"warning"} title={"Please double-check your input"}>
+                                The price of <strong>{data["price"]}</strong> seems too low for a
+                                pizza with over <strong>6</strong> ingredients.
+                            </Alert>
+                        </Cell>
+                    </Grid>
+                )}
+
+                <Grid>
+                    <Cell span={12}>{fields["name"]}</Cell>
+                </Grid>
+                <Grid>
+                    <Cell span={6}>{fields["price"]}</Cell>
+                    <Cell span={6}>{fields["numberOfIngredients"]}</Cell>
+                </Grid>
+            </Tab>
+            {/* Hide the Recipe tab if the user doesn't have the required permission. */}
+            {canEditRecipe && (
+                <Tab label="Recipe">
+                    <Grid>
+                        <Cell span={12}>{fields["recipe"]}</Cell>
+                    </Grid>
+                </Tab>
+            )}
+            <Tab label="History">
+                <Grid>
+                    <Cell span={12}>{fields["history"]}</Cell>
+                </Grid>
+            </Tab>
+        </Tabs>
+    );
+};
+
+export const Extension = () => {
+    return (
+        <>
+            <CmsContentFormRendererPlugin modelId="pizza" render={PizzaLayout} />
+        </>
+    );
+};
diff --git a/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/tsconfig.json b/custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/tsconfig.json
similarity index 100%
rename from custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/tsconfig.json
rename to custom-cms-entry-form-layout/5.41.x/extensions/customCmsEntryFormLayout/tsconfig.json
diff --git a/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/package.json b/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/package.json
deleted file mode 100644
index 93007950..00000000
--- a/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/package.json
+++ /dev/null
@@ -1,14 +0,0 @@
-{
-	"name": "custom-cms-entry-form-layout",
-	"main": "src/index.tsx",
-	"version": "1.0.0",
-	"keywords": [
-		"webiny-extension",
-		"webiny-extension-type:admin"
-	],
-	"dependencies": {
-		"@webiny/app-headless-cms": "0.0.0",
-		"@webiny/ui": "0.0.0",
-		"react": "18.2.0"
-	}
-}
diff --git a/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/src/index.tsx b/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/src/index.tsx
deleted file mode 100644
index e54de6b3..00000000
--- a/custom-cms-entry-form-layout/extensions/customCmsEntryFormLayout/src/index.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import React from "react";
-import { useSecurity } from "@webiny/app-serverless-cms";
-import { Grid, Cell } from "@webiny/ui/Grid";
-import { Tabs, Tab } from "@webiny/ui/Tabs";
-import { Alert } from "@webiny/ui/Alert";
-
-const renderPizzaLayout: CmsContentFormRenderPluginProps["render"] = ({ fields, data }) => {
-    const { getPermission } = useSecurity();
-    const bakeryPermission = getPermission("bakery");
-    const canEditRecipe = bakeryPermission && bakeryPermission.canEditRecipe === true;
-
-    const priceTooLow = data.price < 20 && data.numberOfIngredients > 6;
-
-    return (
-        <Tabs>
-            <Tab label="General">
-                {priceTooLow && (
-                    <Grid>
-                        <Cell span={12}>
-                            <Alert type={"warning"} title={"Please double-check your input"}>
-                                The price of <strong>{data.price}</strong> seems too low for a pizza
-                                with over <strong>6</strong> ingredients.
-                            </Alert>
-                        </Cell>
-                    </Grid>
-                )}
-                <Grid>
-                    <Cell span={12}>{fields.name}</Cell>
-                </Grid>
-                <Grid>
-                    <Cell span={6}>{fields.price}</Cell>
-                    <Cell span={6}>{fields.numberOfIngredients}</Cell>
-                </Grid>
-            </Tab>
-            {canEditRecipe && (
-                <Tab label="Recipe">
-                    <Grid>
-                        <Cell span={12}>{fields.recipe}</Cell>
-                    </Grid>
-                </Tab>
-            )}
-            <Tab label="History">
-                <Grid>
-                    <Cell span={12}>{fields.history}</Cell>
-                </Grid>
-            </Tab>
-        </Tabs>
-    );
-};
-
-export const Extension = () => {
-    return (
-        <>
-            <CmsContentFormRenderPlugin modelId={"pizza"} render={renderPizzaLayout} />
-        </>
-    );
-};