@raketa-cloud/admin 0.0.30 → 0.0.31

package/src/views/event_revisions/meta/edit_form.ejs

@@ -3,21 +3,21 @@
     <h1 class="heading-1">Edit revision / Open graph & meta tags</h1>
   </div>
 
-  <%- render_partial('../_nav.ejs', { settings: meta_settings, active: 'meta' }) %>
+  <%- render_partial('../_nav.ejs', { resource, active: 'meta' }) %>
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ meta_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventType}_revisions/${meta_settings.id}/meta` %>" method="POST" class="form">
-        <%- f.field('meta_settings.title', { required: true }) %>
-        <%- f.field('meta_settings.description', { as: 'textarea', required: true }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventType}_revisions/${resource.id}/meta` %>" method="POST" class="form">
+        <%- f.field('resource.settings.meta.title', { required: true, label: "Meta title" }) %>
+        <%- f.field('resource.settings.meta.description', { as: "textarea", required: true, label: "Meta description" }) %>
 
-        <raketa-image-picker name="meta_settings[image]" value="<%= JSON.stringify(meta_settings.image) %>"></raketa-image-picker>
+        <raketa-image-picker name="resource[settings][meta][image]" value="<%= JSON.stringify(resource.settings?.meta?.image || {}) %>" label="Meta image"></raketa-image-picker>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Save changes', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${meta_settings.originalId}` %>" class="btn-secondary">Back</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.originalId}` %>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>

package/src/views/event_revisions/tags/edit_form.ejs

@@ -3,18 +3,18 @@
     <h1 class="heading-1">Edit revision / Content tags</h1>
   </div>
 
-  <%- render_partial('../_nav.ejs', { settings: tag_settings, active: 'tags' }) %>
+  <%- render_partial('../_nav.ejs', { resource, active: 'tags' }) %>
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ tag_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventType}_revisions/${tag_settings.id}/tags` %>" method="POST" class="form">
-        <%- f.field('tag_settings.tags', { as: 'checkbox_group', required: true, options: tags.map(tag => [tag.id, tag.name]) }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventType}_revisions/${resource.id}/tags` %>" method="POST" class="form">
+        <%- f.field('resource.tags', { as: 'checkbox_group', required: true, options: tags.map(tag => [tag.id, tag.name]) }) %>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Save changes', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${tag_settings.originalId}` %>" class="btn-secondary">Back</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.originalId}` %>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>

package/src/views/event_revisions/visuals/edit_form.ejs

@@ -3,22 +3,18 @@
     <h1 class="heading-1">Edit revision / Visuals</h1>
   </div>
 
-  <%- render_partial('../_nav.ejs', { settings: visual_settings, active: 'visuals' }) %>
+  <%- render_partial('../_nav.ejs', { resource, active: 'visuals' }) %>
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ visual_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventType}_revisions/${visual_settings.id}/visuals` %>" method="POST" class="form">
-        <%- f.field('visual_settings.layout', { as: 'select', required: true, options: [
-          ["default", "Default"],
-          ["landing", "Landing page"],
-          ["headless", "Headless"],
-        ] }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventType}_revisions/${resource.id}/visuals` %>" method="POST" class="form">
+        <%- include('../../_shared/_layout_input.ejs', { f }) %>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Save changes', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${visual_settings.originalId}` %>" class="btn-secondary">Back</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.originalId}` %>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>

package/src/views/events/_form.ejs

@@ -2,23 +2,18 @@
 <form action="<%= resource?.id ? `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}` : `/${_context.locale}/${_context.resourceConfig.eventTypePlural}` %>" method="post" class="form">
   <%- f.field('resource.title', { required: true }) %>
   <%- f.field('resource.slug', { label: "URL", required: true }) %>
-  <%- f.field('resource.publish_at', { required: true, type: 'datetime-local', label: 'Publish at (UTC)' }) %>
-  <%- f.field('resource.starts_at', { required: true, type: 'datetime-local', label: 'Starts at (UTC)' }) %>
-  <%- f.field('resource.ends_at', { required: true, type: 'datetime-local', label: 'Ends at (UTC)' }) %>
+  <%- f.field('resource.publishAt', { required: true, type: 'datetime-local', label: 'Publish at (UTC)' }) %>
+  <%- f.field('resource.startsAt', { required: true, type: 'datetime-local', label: 'Starts at (UTC)' }) %>
+  <%- f.field('resource.endsAt', { required: true, type: 'datetime-local', label: 'Ends at (UTC)' }) %>
   <%- f.field('resource.visibility', { as: 'select', required: true, options: visibilityOptions }) %>
-  <%- f.field('resource.username', { required: true }) %>
-  <%- f.field('resource.password', { required: true }) %>
 
-  <%- f.field('resource.layout', { as: 'select', required: true, options: [
-      ["default", "Default"],
-      ["landing", "Landing page"],
-      ["headless", "Headless"],
-    ] }) %>
+  <%- include('../_shared/_credentials_input.ejs', { f, visibilityFieldId: "f_resource_visibility"}) %>
+  <%- include('../_shared/_layout_input.ejs', { f }) %>
 
-  <%- f.field('resource.meta_title', { required: true }) %>
-  <%- f.field('resource.meta_description', { as: "textarea", required: true }) %>
+  <%- f.field('resource.settings.meta.title', { required: true, label: "Meta title" }) %>
+  <%- f.field('resource.settings.meta.description', { as: "textarea", required: true, label: "Meta description" }) %>
 
-  <raketa-image-picker name="resource[meta_image]" value="<%= JSON.stringify(resource.meta_image) %>"></raketa-image-picker>
+  <raketa-image-picker name="resource[settings][meta][image]" value="<%= JSON.stringify(resource.settings?.meta?.image || {}) %>" label="Meta image"></raketa-image-picker>
 
   <%- f.field('resource.tags', { as: 'checkbox_group', required: true, options: tags.map(tag => [tag.id, tag.name]) }) %>
 
@@ -55,29 +50,3 @@
     <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore nostrum fugit sint sunt distinctio ut cum, corrupti ad error, quo labore minima. Reprehenderit quasi maxime repudiandae voluptatum commodi saepe molestiae?</p>
   </div>
 </div>
-
-<script>
-  function onVisibilityChange(event) {
-    const newValue = event.target.value;
-
-    if (newValue === "protected") {
-      document.getElementById("f_username").parentElement.style.display = "block";
-      document.getElementById("f_username").required = true;
-      document.getElementById("f_password").parentElement.style.display = "block";
-      document.getElementById("f_password").required = true;
-    } else {
-      document.getElementById("f_username").parentElement.style.display = "none";
-      document.getElementById("f_username").required = false;
-      document.getElementById("f_password").parentElement.style.display = "none";
-      document.getElementById("f_password").required = false;
-    }
-  }
-
-  onVisibilityChange({
-    target: {
-      value: '<%= resource.visibility %>'
-    }
-  })
-
-  document.getElementById("f_visibility").addEventListener("change", onVisibilityChange)
-</script>

package/src/views/events/deletes/create_form.ejs

@@ -5,15 +5,15 @@
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ deleteAction }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${deleteAction.id}/deletes` %>" method="POST" class="form">
-        <%- f.field('deleteAction.redirect', { as: 'select', required: true,options: [['301', 'Redirect to another page'], ['404', 'Return 404'],['410', 'Return 410']] }) %>
-        <%- f.field('deleteAction.destination', {label: 'Destination URL', required: true}) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}/deletes` %>" method="POST" class="form">
+        <%- f.field('resource.redirect', { as: 'select', required: true,options: [['301', 'Redirect to another page'], ['404', 'Return 404'],['410', 'Return 410']] }) %>
+        <%- f.field('resource.destination', {label: 'Destination URL', required: true}) %>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Proceed', { class: 'btn-primary' }) %>
-            <a href="<%=`/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${deleteAction.id}`%>" class="btn-secondary">Back</a>
+            <a href="<%=`/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}`%>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>
@@ -41,15 +41,15 @@
     const newValue = event.target.value;
     const requiresRedirect = newValue === "301"
 
-    document.getElementById("f_destination").parentElement.style.display = requiresRedirect ? "block" : "none";
-    document.getElementById("f_destination").required = requiresRedirect;
+    document.getElementById("f_resource_destination").parentElement.style.display = requiresRedirect ? "block" : "none";
+    document.getElementById("f_resource_destination").required = requiresRedirect;
   }
 
   onDestinationChange({
     target: {
-      value: '<%= deleteAction.redirect %>'
+      value: '<%= resource.redirect %>'
     }
   })
 
-  document.getElementById("f_redirect").addEventListener("change", onDestinationChange)
+  document.getElementById("f_resource_redirect").addEventListener("change", onDestinationChange)
 </script>

package/src/views/events/translations/_form.ejs

@@ -1,37 +1,32 @@
-<% form_for({ translation }, errors, (f) => { %>
-<form action="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}/translations` %>" method="post" class="form">
+<% form_for({ resource }, errors, (f) => { %>
+<form action="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${blueprint.id}/translations` %>" method="post" class="form">
   <input type="hidden" name="target_locale" value="<%= targetLocale %>" />
 
-  <%- f.field('translation.title', { required: true }) %>
-  <%- f.field('translation.slug', { label: "URL", required: true }) %>
-  <%- f.field('translation.publish_at', { required: true, type: 'datetime-local' }) %>
-  <%- f.field('translation.starts_at', { required: true, type: 'datetime-local' }) %>
-  <%- f.field('translation.ends_at', { required: true, type: 'datetime-local' }) %>
-  <%- f.field('translation.visibility', { as: 'select', required: true, options: visibilityOptions }) %>
-  <%- f.field('translation.username', { required: true }) %>
-  <%- f.field('translation.password', { required: true }) %>
+  <%- f.field('resource.title', { required: true }) %>
+  <%- f.field('resource.slug', { label: "URL", required: true }) %>
+  <%- f.field('resource.publishAt', { required: true, type: 'datetime-local' }) %>
+  <%- f.field('resource.startsAt', { required: true, type: 'datetime-local' }) %>
+  <%- f.field('resource.endsAt', { required: true, type: 'datetime-local' }) %>
+  <%- f.field('resource.visibility', { as: 'select', required: true, options: visibilityOptions }) %>
 
-  <%- f.field('translation.layout', { as: 'select', required: true, options: [
-      ["default", "Default"],
-      ["landing", "Landing page"],
-      ["headless", "Headless"],
-    ] }) %>
+  <%- include('../../_shared/_credentials_input.ejs', { f, visibilityFieldId: "f_resource_visibility"}) %>
+  <%- include('../../_shared/_layout_input.ejs', { f }) %>
 
-  <%- f.field('translation.meta_title', { required: true }) %>
-  <%- f.field('translation.meta_description', { as: "textarea", required: true }) %>
+  <%- f.field('resource.settings.meta.title', { required: true, label: "Meta title" }) %>
+  <%- f.field('resource.settings.meta.description', { as: "textarea", required: true, label: "Meta description" }) %>
 
-  <raketa-image-picker name="translation[meta_image]" value="<%= JSON.stringify(translation.meta_image) %>"></raketa-image-picker>
+  <raketa-image-picker name="resource[settings][meta][image]" value="<%= JSON.stringify(resource.settings?.meta?.image || {}) %>" label="Meta image"></raketa-image-picker>
 
   <h6>Original tags:</h6>
-  <div><%= blueprint_tags.map((tag) => tag.name).join(", ")%></div>
+  <div><%= blueprint.tags.map((tag) => tag.name).join(", ")%></div>
 
-  <%- f.field('translation.tags', { as: 'checkbox_group', required: true, options: tags.map(tag => [tag.id, tag.name])}) %>
+  <%- f.field('resource.tags', { as: 'checkbox_group', required: true, options: tags.map(tag => [tag.id, tag.name])}) %>
 
   <div class="form-actions">
     <div class="btn-toolbar">
       <%- f.submit('Save record', { class: 'btn-primary' }) %>
 
-      <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}` %>" class="btn-secondary">Cancel</a>
+      <a href="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${blueprint.id}` %>" class="btn-secondary">Cancel</a>
     </div>
   </div>
 </form>
@@ -50,29 +45,3 @@
     <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore nostrum fugit sint sunt distinctio ut cum, corrupti ad error, quo labore minima. Reprehenderit quasi maxime repudiandae voluptatum commodi saepe molestiae?</p>
   </div>
 </div>
-
-<script>
-  function onVisibilityChange(event) {
-    const newValue = event.target.value;
-
-    if (newValue === "protected") {
-      document.getElementById("f_username").parentElement.style.display = "block";
-      document.getElementById("f_username").required = true;
-      document.getElementById("f_password").parentElement.style.display = "block";
-      document.getElementById("f_password").required = true;
-    } else {
-      document.getElementById("f_username").parentElement.style.display = "none";
-      document.getElementById("f_username").required = false;
-      document.getElementById("f_password").parentElement.style.display = "none";
-      document.getElementById("f_password").required = false;
-    }
-  }
-
-  onVisibilityChange({
-    target: {
-      value: '<%= resource.visibility %>'
-    }
-  })
-
-  document.getElementById("f_visibility").addEventListener("change", onVisibilityChange)
-</script>

package/src/views/events/urls/create_form.ejs

@@ -4,13 +4,13 @@
   </div>
 
   <div class="grid gap-4 md:grid-cols-3">
-    <% form_for({ change }, errors, (f) => { %>
-    <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${change.id}/urls` %>" method="post" class="form">
-      <%- f.field('change.slug', { label: "URL", required: true }) %>
-      <%- f.field('change.redirect', { as: "checkbox", value: "1", label: "Create 301 redirect for the old URL" }) %>
+    <% form_for({ resource }, errors, (f) => { %>
+    <form action="<%= `/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}/urls` %>" method="post" class="form">
+      <%- f.field('resource.slug', { label: "URL", required: true }) %>
+      <%- f.field('resource.redirect', { as: "checkbox", value: "1", label: "Create 301 redirect for the old URL" }) %>
 
       <%- f.submit('Save record', { class: 'btn-primary' }) %>
-      <a href="<%=`/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${change.id}`%>" class="btn-secondary">Back</a>
+      <a href="<%=`/${_context.locale}/${_context.resourceConfig.eventTypePlural}/${resource.id}`%>" class="btn-secondary">Back</a>
     </form>
     <% }) %>
 

package/src/views/layouts/application.ejs

@@ -29,44 +29,44 @@
 
       <div class="my-4">
         <% _context.layout.sidebar.forEach((menu, idx) => { %>
-          <% if (menu.submenus) { %>
-
-            <div class="group/item">
-              <details class="unstyled-details">
-                <summary class="relative flex items-center gap-3 px-5 py-4 text-raketa-primary cursor-pointer transition-all duration-300 ease-in-out">
-                  <div class="size-6 opacity-100 group-[.expanded]:opacity-50">
-                    <%- atob(menu.icon) %>
-                  </div>
-
-                  <span class="group-[.expanded]:block hidden"><%= menu.label %></span>
-
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="icon-toggle absolute right-4 size-4 group-[.expanded]:block hidden">
-                    <path fill-rule="evenodd" d="M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd" />
-                  </svg>
-                </summary>
-
-                <div class="pl-12 py-4 bg-raketa-background/50 group-[.expanded]:block hidden">
-                  <% menu.submenus.forEach(submenu => { %>
-                    <a href="<%= `/${_context.locale}/${submenu.link}` %>" class="block py-2 body-2 text-raketa-foreground/50 hover:text-raketa-foreground transition-all ease-in-out duration-300"><%= submenu.label %></a>
-                  <% }) %>
-                </div>
-              </details>
+        <% if (menu.submenus) { %>
+
+        <div class="group/item">
+          <details class="unstyled-details">
+            <summary class="relative flex items-center gap-3 px-5 py-4 text-raketa-primary cursor-pointer transition-all duration-300 ease-in-out">
+              <div class="size-6 opacity-100 group-[.expanded]:opacity-50">
+                <%- atob(menu.icon) %>
+              </div>
+
+              <span class="group-[.expanded]:block hidden"><%= menu.label %></span>
+
+              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="icon-toggle absolute right-4 size-4 group-[.expanded]:block hidden">
+                <path fill-rule="evenodd" d="M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd" />
+              </svg>
+            </summary>
+
+            <div class="pl-12 py-4 bg-raketa-background/50 group-[.expanded]:block hidden">
+              <% menu.submenus.forEach(submenu => { %>
+              <a href="<%= `/${_context.locale}/${submenu.link}` %>" class="block py-2 body-2 text-raketa-foreground/50 hover:text-raketa-foreground transition-all ease-in-out duration-300"><%= submenu.label %></a>
+              <% }) %>
             </div>
+          </details>
+        </div>
 
-          <% } else { %>
+        <% } else { %>
 
-            <div class="group/item">
-              <a href="<%= `/${_context.locale}${menu.link}` %>" class="relative flex items-center gap-3 px-5 py-4 text-raketa-primary hover:bg-raketa-primary hover:text-white group-[.is-active]/item:bg-raketa-primary group-[.is-active]/item:text-white">
-                <div class="size-6 opacity-100 group-[.expanded]:opacity-50">
-                  <%- atob(menu.icon) %>
-                </div>
-
-                <span class="group-[.expanded]:block hidden"><%= menu.label %></span>
-                <div class="absolute group-hover/item:opacity-100 group-[.is-active]/item:opacity-100 opacity-0 top-0 z-10 -right-[10px] w-0 h-0 border-t-[28px] border-t-transparent border-b-[28px] border-b-transparent border-l-[10px] border-l-raketa-primary"></div>
-              </a>
+        <div class="group/item">
+          <a href="<%= `/${_context.locale}${menu.link}` %>" class="relative flex items-center gap-3 px-5 py-4 text-raketa-primary hover:bg-raketa-primary hover:text-white group-[.is-active]/item:bg-raketa-primary group-[.is-active]/item:text-white">
+            <div class="size-6 opacity-100 group-[.expanded]:opacity-50">
+              <%- atob(menu.icon) %>
             </div>
 
-          <% } %>
+            <span class="group-[.expanded]:block hidden"><%= menu.label %></span>
+            <div class="absolute group-hover/item:opacity-100 group-[.is-active]/item:opacity-100 opacity-0 top-0 z-10 -right-[10px] w-0 h-0 border-t-[28px] border-t-transparent border-b-[28px] border-b-transparent border-l-[10px] border-l-raketa-primary"></div>
+          </a>
+        </div>
+
+        <% } %>
         <% }) %>
 
       </div>
@@ -119,7 +119,9 @@
       parent.querySelectorAll('[data-auto="1"]').forEach(node => node.remove())
 
       TIMEZONES.forEach(timeZone => {
-        const strTime = fakeUTCDate.toLocaleString("en-EU",{timeZone: `${timeZone.value}`});
+        const strTime = fakeUTCDate.toLocaleString("en-EU", {
+          timeZone: `${timeZone.value}`
+        });
         const hint = document.createElement("div");
 
         hint.classList.add('hint')
@@ -134,7 +136,27 @@
       enhanceDateTimeInputs(input);
 
       input.addEventListener("change", (event) => enhanceDateTimeInputs(event.target))
-    } )
+    })
+  </script>
+
+  <script>
+    function isValidJSON(value) {
+      try {
+        JSON.parse(value);
+      } catch (e) {
+        return false;
+      }
+
+      return true;
+    };
+
+    document.querySelectorAll('[data-validations-json]').forEach(input => {
+      input.addEventListener("change", (event) => {
+        if (event.target.value && !isValidJSON(event.target.value)) {
+          event.target.setCustomValidity("Please enter a valid JSON structure.");
+        } else event.target.setCustomValidity("");
+      })
+    })
   </script>
 </body>
 

package/src/views/page_revisions/_nav.ejs

@@ -7,31 +7,31 @@
   <div class="flex items-center justify-between mb-4">
     <div class="flex items-center border-b-2">
       <div class=" <%= active === 'general' ? activeClass : inactiveClass %>">
-        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${settings.id}/general/edit` %>" class="text-raketa-primary font-semibold">
+        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/general/edit` %>" class="text-raketa-primary font-semibold">
           General
         </a>
       </div>
 
       <div class="<%= active === 'visuals' ? activeClass : inactiveClass %>">
-        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${settings.id}/visuals/edit` %>" class="text-raketa-primary font-semibold">
+        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/visuals/edit` %>" class="text-raketa-primary font-semibold">
           Visuals
         </a>
       </div>
 
       <div class="<%= active === 'codes' ? activeClass : inactiveClass %>">
-        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${settings.id}/codes/edit` %>" class="text-raketa-primary font-semibold">
+        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/codes/edit` %>" class="text-raketa-primary font-semibold">
           Code customizations
         </a>
       </div>
 
       <div class="<%= active === 'meta' ? activeClass : inactiveClass %>">
-        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${settings.id}/meta/edit` %>" class="text-raketa-primary font-semibold">
+        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/meta/edit` %>" class="text-raketa-primary font-semibold">
           Open graph & meta tags
         </a>
       </div>
 
       <div class="<%= active === 'tags' ? activeClass : inactiveClass %>">
-        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${settings.id}/tags/edit` %>" class="text-raketa-primary font-semibold">
+        <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/tags/edit` %>" class="text-raketa-primary font-semibold">
           Content tags
         </a>
       </div>

package/src/views/page_revisions/codes/edit_form.ejs

@@ -3,19 +3,30 @@
     <h1 class="heading-1">Edit revision / Code customizations</h1>
   </div>
 
-  <%- render_partial('../_nav.ejs', { settings: code_settings, active: 'codes' }) %>
+  <%- render_partial('../_nav.ejs', { resource, active: 'codes' }) %>
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ code_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${code_settings.id}/codes` %>" method="POST" class="form">
-        <%- f.field('code_settings.scripts', { as: 'textarea', }) %>
-        <%- f.field('code_settings.structured_data', { label: 'Structured data (JSON)', as: 'textarea', hint: 'Click here for a structured data verification tool' }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/codes` %>" method="POST" class="form">
+        <%- f.field('resource.settings.codes.scripts', {
+          as: 'textarea',
+          "data-validations-json": true,
+          value: JSON.stringify(resource.settings?.codes?.scripts || undefined)
+        }) %>
+
+        <%- f.field('resource.settings.codes.structured_data', {
+          label: 'Structured data (JSON)',
+          as: 'textarea',
+          hint: 'Click here for a structured data verification tool',
+          "data-validations-json": true,
+          value: JSON.stringify(resource.settings?.codes?.structured_data || undefined)
+        }) %>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Save changes', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${code_settings.originalId}` %>" class="btn-secondary">Back</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${resource.originalId}` %>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>

package/src/views/page_revisions/general/edit_form.ejs

@@ -3,23 +3,22 @@
     <h1 class="heading-1">Edit revision / General</h1>
   </div>
 
-  <%- render_partial('../_nav.ejs', { settings: general_settings, active: 'general' }) %>
+  <%- render_partial('../_nav.ejs', { resource, active: 'general' }) %>
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ general_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${general_settings.id}/general` %>" method="POST" class="form">
-        <%- f.field('general_settings.title', { required: true }) %>
-        <%- f.field('general_settings.slug', { label: "URL", required: true }) %>
-        <%- f.field('general_settings.visibility', { as: 'select', required: true, options: visibilityOptions }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/general` %>" method="POST" class="form">
+        <%- f.field('resource.title', { required: true }) %>
+        <%- f.field('resource.slug', { label: "URL", required: true }) %>
+        <%- f.field('resource.visibility', { as: 'select', required: true, options: visibilityOptions }) %>
 
-        <%- f.field('general_settings.username', { required: true }) %>
-        <%- f.field('general_settings.password', { required: true }) %>
+        <%- include('../../_shared/_credentials_input.ejs', { f, visibilityFieldId: "f_resource_visibility"}) %>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Save changes', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${general_settings.originalId}` %>" class="btn-secondary">Back</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${resource.originalId}` %>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>
@@ -41,29 +40,3 @@
     </div>
   </div>
 </div>
-
-<script>
-  function onVisibilityChange(event) {
-    const newValue = event.target.value;
-
-    if (newValue === "protected") {
-      document.getElementById("f_username").parentElement.style.display = "block";
-      document.getElementById("f_username").required = true;
-      document.getElementById("f_password").parentElement.style.display = "block";
-      document.getElementById("f_password").required = true;
-    } else {
-      document.getElementById("f_username").parentElement.style.display = "none";
-      document.getElementById("f_username").required = false;
-      document.getElementById("f_password").parentElement.style.display = "none";
-      document.getElementById("f_password").required = false;
-    }
-  }
-
-  onVisibilityChange({
-    target: {
-      value: '<%= general_settings.visibility %>'
-    }
-  })
-
-  document.getElementById("f_visibility").addEventListener("change", onVisibilityChange)
-</script>

package/src/views/page_revisions/locks/create_form.ejs

@@ -5,13 +5,13 @@
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ lock_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${lock_settings.revision.id}/locks` %>" method="POST" class="form">
-        <%- f.field('lock_settings.message', { as: 'textarea', label: 'Lock Message', required: true }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/locks` %>" method="POST" class="form">
+        <%- f.field('resource.message', { as: 'textarea', label: 'Lock Message', required: true }) %>
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Lock revision', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${lock_settings.revision.originalId}` %>" class="btn-secondary">Cancel</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${resource.originalId}` %>" class="btn-secondary">Cancel</a>
           </div>
         </div>
       </form>

package/src/views/page_revisions/meta/edit_form.ejs

@@ -3,21 +3,21 @@
     <h1 class="heading-1">Edit revision / Open graph & meta tags</h1>
   </div>
 
-  <%- render_partial('../_nav.ejs', { settings: meta_settings, active: 'meta' }) %>
+  <%- render_partial('../_nav.ejs', { resource, active: 'meta' }) %>
 
   <div class="grid gap-4 md:grid-cols-3">
     <div>
-      <% form_for({ meta_settings }, errors, (f) => { %>
-      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${meta_settings.id}/meta` %>" method="POST" class="form">
-        <%- f.field('meta_settings.title', { required: true }) %>
-        <%- f.field('meta_settings.description', { as: 'textarea', required: true }) %>
+      <% form_for({ resource }, errors, (f) => { %>
+      <form action="<%= `/${_context.locale}/${_context.resourceConfig.pageType}_revisions/${resource.id}/meta` %>" method="POST" class="form">
+        <%- f.field('resource.settings.meta.title', { required: true, label: "Meta title" }) %>
+        <%- f.field('resource.settings.meta.description', { as: "textarea", required: true, label: "Meta description" }) %>
 
-        <raketa-image-picker name="meta_settings[image]" value="<%= JSON.stringify(meta_settings.image) %>"></raketa-image-picker>
+        <raketa-image-picker name="resource[settings][meta][image]" value="<%= JSON.stringify(resource.settings?.meta?.image || {}) %>" label="Meta image"></raketa-image-picker>
 
         <div class="form-actions">
           <div class="btn-toolbar">
             <%- f.submit('Save changes', { class: 'btn-primary' }) %>
-            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${meta_settings.originalId}` %>" class="btn-secondary">Back</a>
+            <a href="<%= `/${_context.locale}/${_context.resourceConfig.pageTypePlural}/${resource.originalId}` %>" class="btn-secondary">Back</a>
           </div>
         </div>
       </form>