apostrophe 4.3.2 → 4.4.0

package/modules/@apostrophecms/ui/ui/apos/stores/modal.js

@@ -0,0 +1,180 @@
+import { defineStore } from 'pinia';
+import { ref, computed } from 'vue';
+import cuid from 'cuid';
+
+export const useModalStore = defineStore('modal', () => {
+  const stack = ref([]);
+  const activeId = ref(null);
+
+  const activeModal = computed(() => {
+    return stack.value.find(modal => activeId.value === modal.id);
+  });
+
+  function add(modal) {
+    stack.value.push(modal);
+  }
+
+  function remove(id) {
+    const modal = get(id);
+    if (!modal) {
+      return;
+    }
+
+    modal.resolve(modal.result);
+    stack.value = stack.value.filter(modal => id !== modal.id);
+    const current = getAt(-1);
+    activeId.value = current.id || null;
+    apos.bus.$emit('modal-resolved', modal);
+  }
+
+  function get(id) {
+    return id
+      ? stack.value.find(modal => id === modal.id)
+      : stack.value;
+  }
+
+  function getAt(index) {
+    const last = stack.value.length - 1;
+    const target = index < 0
+      ? last + 1 + index
+      : index > stack.value.length
+        ? last
+        : index;
+
+    return stack.value[target] || {};
+  }
+
+  function getProperties(id) {
+    const stackModal = stack.value.find(modal => id === modal.id);
+    if (!stackModal || !apos.modal.modals) {
+      return {};
+    }
+
+    const properties = {
+      ...apos.modal.modals
+        .find(modal => modal.componentName === stackModal.componentName &&
+          modal.props.moduleName === stackModal.props.moduleName)
+    };
+
+    return properties;
+  }
+
+  async function execute(componentName, props) {
+    return new Promise((resolve) => {
+      const item = {
+        id: `modal:${cuid()}`,
+        componentName,
+        resolve,
+        props: props || {},
+        elementsToFocus: [],
+        focusedElement: null
+      };
+
+      activeId.value = item.id;
+      stack.value.push(item);
+      apos.bus.$emit('modal-launched', item);
+    });
+  }
+
+  function updateModalData(id, data) {
+    stack.value = stack.value.map((modal) => {
+      return modal.id === id ? {
+        ...modal,
+        ...data
+      } : modal;
+    });
+  }
+
+  function setModalResult(modalId, result) {
+    stack.value = stack.value.map((modal) => {
+      return modal.id === modalId
+        ? {
+          ...modal,
+          result
+        }
+        : modal;
+    });
+  }
+
+  async function confirm(content, options = {}) {
+    return execute(apos.modal.components.confirm, {
+      content,
+      mode: 'confirm',
+      options
+    });
+  }
+
+  async function alert(alertContent, options = {}) {
+    return execute(apos.modal.components.confirm, {
+      content: alertContent,
+      mode: 'alert',
+      options
+    });
+  }
+
+  // Returns true if el1 is "on top of" el2 in the
+  // modal stack, as viewed by the user. If el1 is a
+  // modal that appears later in the stack than el2
+  // (visually stacked on top), this method returns true.
+  // If el2 is `document` and el1 is a modal, this
+  // method returns true. For convenenience, if el1
+  // or el2 is not a modal, it is treated as its DOM
+  // parent modal, or as `document`. If el1 has no
+  // parent modal this method always returns false.
+  //
+  // If el1 is no longer connected to the DOM then it
+  // is also considered to be "on top" e.g. not something
+  // that should concern `v-click-outside-element` and
+  // similar functionality. This is necessary because
+  // sometimes Vue removes elements from the DOM before
+  // we can examine their relationships.
+  function onTopOf(el1, el2) {
+    if (el2.matches('[data-apos-menu]')) {
+      return false;
+    }
+    if (!el1.isConnected) {
+    // If el1 is no longer in the DOM we can't make a proper determination,
+    // returning true prevents unwanted things like click-outside-element
+    // events from firing
+      return true;
+    }
+    if (!el1.matches('[data-apos-modal]')) {
+      el1 = el1.closest('[data-apos-modal]') || document;
+    }
+    if (!el2.matches('[data-apos-modal]')) {
+      el2 = el2.closest('[data-apos-modal]') || document;
+    }
+    if (el1 === document) {
+      return false;
+    }
+    if (el2 === document) {
+      return true;
+    }
+    const index1 = stack.value.findIndex(modal => modal.modalEl === el1);
+    const index2 = stack.value.findIndex(modal => modal.modalEl === el2);
+    if (index1 === -1) {
+      throw new Error('apos.modal.onTopOf: el1 is not in the modal stack');
+    }
+    if (index2 === -1) {
+      throw new Error('apos.modal.onTopOf: el2 is not in the modal stack');
+    }
+    return index1 > index2;
+  }
+
+  return {
+    stack,
+    activeId,
+    activeModal,
+    add,
+    remove,
+    get,
+    getAt,
+    getProperties,
+    execute,
+    updateModalData,
+    setModalResult,
+    confirm,
+    alert,
+    onTopOf
+  };
+});

package/modules/@apostrophecms/widget-type/ui/apos/components/AposWidgetEditor.vue

@@ -6,7 +6,6 @@
     @inactive="modal.active = false"
     @show-modal="modal.showModal = true"
     @esc="confirmAndCancel"
-    @no-modal="$emit('safe-close')"
   >
     <template #breadcrumbs>
       <AposModalBreadcrumbs v-if="breadcrumbs && breadcrumbs.length" :items="breadcrumbs" />
@@ -29,6 +28,7 @@
               v-show="tab.name === currentTab"
               :key="tab.name"
               :ref="tab.name"
+              :data-apos-test="`schema:${tab.name}`"
               :trigger-validation="triggerValidation"
               :current-fields="groups[tab.name].fields"
               :schema="groups[tab.name].schema"
@@ -108,7 +108,7 @@ export default {
       default: null
     }
   },
-  emits: [ 'safe-close', 'modal-result' ],
+  emits: [ 'modal-result' ],
   data() {
     const moduleOptions = window.apos.modules[apos.area.widgetManagers[this.type]];
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "apostrophe",
-  "version": "4.3.2",
+  "version": "4.4.0",
   "description": "The Apostrophe Content Management System.",
   "main": "index.js",
   "scripts": {
@@ -99,6 +99,7 @@
     "passport-local": "^1.0.0",
     "path-to-regexp": "^1.8.0",
     "performance-now": "^2.1.0",
+    "pinia": "^2.1.7",
     "postcss-html": "^1.3.0",
     "postcss-loader": "^5.0.0",
     "postcss-scss": "^4.0.3",
@@ -138,9 +139,8 @@
     "mocha": "^9.1.2",
     "nyc": "^15.1.0",
     "replace-in-file": "^6.1.0",
-    "stylelint": "^14.6.1",
-    "stylelint-declaration-strict-value": "^1.8.0",
-    "stylelint-order": "^5.0.0",
+    "stylelint": "^16.5.0",
+    "stylelint-config-apostrophe": "github:apostrophecms/stylelint-config-apostrophe",
     "vue-eslint-parser": "^7.1.1",
     "vue-template-compiler": "^2.7.14"
   },

package/test/modules/@apostrophecms/search/views/index.html

@@ -0,0 +1 @@
+{{ data.docs | json }}

package/test/pages.js

@@ -457,6 +457,233 @@ describe('Pages', function() {
     assert.strictEqual(page.path, `${homeId.replace(':en:published', '')}/another-parent/parent/sibling`);
   });
 
+  describe('move peer pages', function () {
+    this.afterEach(async function() {
+      await apos.doc.db.deleteMany({
+        type: 'test-page'
+      });
+    });
+
+    it('moving /bar under /foo should wind up with /foo/bar', async function() {
+      const fooPage = await apos.page.insert(
+        apos.task.getReq(),
+        '_home',
+        'lastChild',
+        {
+          slug: '/foo',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Foo Page'
+        }
+      );
+      const barPage = await apos.page.insert(
+        apos.task.getReq(),
+        '_home',
+        'lastChild',
+        {
+          slug: '/bar',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Bar Page'
+        }
+      );
+      const childPage = await apos.page.insert(
+        apos.task.getReq(),
+        barPage._id,
+        'lastChild',
+        {
+          slug: '/bar/child',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Child Page'
+        }
+      );
+
+      await apos.page.move(
+        apos.task.getReq(),
+        barPage._id,
+        fooPage._id,
+        'lastChild'
+      );
+
+      const movedPage = await apos.page.find(apos.task.getAnonReq(), { _id: barPage._id }).toObject();
+      const movedChildPage = await apos.page.find(apos.task.getAnonReq(), { _id: childPage._id }).toObject();
+
+      const actual = {
+        bar: {
+          path: movedPage.path,
+          rank: movedPage.rank,
+          slug: movedPage.slug
+        },
+        child: {
+          path: movedChildPage.path,
+          rank: movedChildPage.rank,
+          slug: movedChildPage.slug
+        }
+      };
+      const expected = {
+        bar: {
+          path: fooPage.path.concat('/', barPage.aposDocId),
+          rank: 0,
+          slug: '/foo/bar'
+        },
+        child: {
+          path: movedPage.path.concat('/', childPage.aposDocId),
+          rank: 0,
+          slug: '/foo/bar/child'
+        }
+      };
+
+      assert.deepEqual(actual, expected);
+    });
+
+    it('moving peer /foo/bar under /foo should wind up with /foo/bar', async function() {
+      const fooPage = await apos.page.insert(
+        apos.task.getReq(),
+        '_home',
+        'lastChild',
+        {
+          slug: '/foo',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Foo Page'
+        }
+      );
+      const barPage = await apos.page.insert(
+        apos.task.getReq(),
+        '_home',
+        'lastChild',
+        {
+          slug: '/foo/bar',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Bar Page'
+        }
+      );
+      const childPage = await apos.page.insert(
+        apos.task.getReq(),
+        barPage._id,
+        'lastChild',
+        {
+          slug: '/foo/bar/child',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Child Page'
+        }
+      );
+
+      await apos.page.move(
+        apos.task.getReq(),
+        barPage._id,
+        fooPage._id,
+        'lastChild'
+      );
+
+      const movedPage = await apos.page.find(apos.task.getAnonReq(), { _id: barPage._id }).toObject();
+      const movedChildPage = await apos.page.find(apos.task.getAnonReq(), { _id: childPage._id }).toObject();
+
+      const actual = {
+        bar: {
+          path: movedPage.path,
+          rank: movedPage.rank,
+          slug: movedPage.slug
+        },
+        child: {
+          path: movedChildPage.path,
+          rank: movedChildPage.rank,
+          slug: movedChildPage.slug
+        }
+      };
+      const expected = {
+        bar: {
+          path: fooPage.path.concat('/', barPage.aposDocId),
+          rank: 0,
+          slug: '/foo/bar'
+        },
+        child: {
+          path: movedPage.path.concat('/', childPage.aposDocId),
+          rank: 0,
+          slug: '/foo/bar/child'
+        }
+      };
+
+      assert.deepEqual(actual, expected);
+    });
+
+    it('moving /foobar under /foo should wind up with /foo/foobar', async function() {
+      const fooPage = await apos.page.insert(
+        apos.task.getReq(),
+        '_home',
+        'lastChild',
+        {
+          slug: '/foo',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Foo Page'
+        }
+      );
+      const foobarPage = await apos.page.insert(
+        apos.task.getReq(),
+        '_home',
+        'lastChild',
+        {
+          slug: '/foobar',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Foobar Page'
+        }
+      );
+      const childPage = await apos.page.insert(
+        apos.task.getReq(),
+        foobarPage._id,
+        'lastChild',
+        {
+          slug: '/foobar/child',
+          visibility: 'public',
+          type: 'test-page',
+          title: 'Child Page'
+        }
+      );
+
+      await apos.page.move(
+        apos.task.getReq(),
+        foobarPage._id,
+        fooPage._id,
+        'lastChild'
+      );
+
+      const movedPage = await apos.page.find(apos.task.getAnonReq(), { _id: foobarPage._id }).toObject();
+      const movedChildPage = await apos.page.find(apos.task.getAnonReq(), { _id: childPage._id }).toObject();
+
+      const actual = {
+        foobar: {
+          path: movedPage.path,
+          rank: movedPage.rank,
+          slug: movedPage.slug
+        },
+        child: {
+          path: movedChildPage.path,
+          rank: movedChildPage.rank,
+          slug: movedChildPage.slug
+        }
+      };
+      const expected = {
+        foobar: {
+          path: fooPage.path.concat('/', foobarPage.aposDocId),
+          rank: 0,
+          slug: '/foo/foobar'
+        },
+        child: {
+          path: movedPage.path.concat('/', childPage.aposDocId),
+          rank: 0,
+          slug: '/foo/foobar/child'
+        }
+      };
+
+      assert.deepEqual(actual, expected);
+    });
+  });
+
   it('inferred page relationships are correct', async function() {
     const req = apos.task.getReq();
     const pages = await apos.page.find(req, {}).toArray();

package/test/schemas.js

@@ -2401,6 +2401,190 @@ describe('Schemas', function() {
     assert.deepEqual(actual, expected);
   });
 
+  describe('field.readOnly with default value', function() {
+    const givenSchema = [
+      {
+        name: 'title',
+        type: 'string'
+      },
+      {
+        name: 'array',
+        type: 'array',
+        schema: [
+          {
+            name: 'planet',
+            type: 'string',
+            def: 'Earth',
+            readOnly: true
+          },
+          {
+            name: 'moon',
+            type: 'string'
+          }
+        ]
+      },
+      {
+        name: 'object',
+        type: 'object',
+        schema: [
+          {
+            name: 'planet',
+            type: 'string',
+            def: 'Earth',
+            readOnly: true
+          },
+          {
+            name: 'moon',
+            type: 'string'
+          }
+        ]
+      },
+      {
+        name: '_relationship',
+        type: 'relationship',
+        limit: 1,
+        withType: '@apostrophecms/any-page-type',
+        label: 'Page Title',
+        idsStorage: 'pageId',
+        schema: [
+          {
+            name: 'planet',
+            type: 'string',
+            def: 'Earth',
+            readOnly: true
+          },
+          {
+            name: 'moon',
+            type: 'string'
+          }
+        ]
+      }
+    ];
+
+    it('should keep read only values when editing a document', async function() {
+      const req = apos.task.getReq();
+      const schema = apos.schema.compose({
+        addFields: givenSchema
+      });
+      const home = await apos.page.find(req, { slug: '/' }).toObject();
+
+      const data = {
+        _relationship: [
+          {
+            ...home,
+            _fields: {
+              planet: 'Saturn',
+              moon: 'Titan'
+            }
+          }
+        ],
+        array: [
+          {
+            _id: 'Jupiter-Io',
+            moon: 'Io'
+          },
+          {
+            _id: 'Mars-Phobos',
+            moon: 'Phobos'
+          }
+        ],
+        object: {
+          _id: 'Neptune-Triton',
+          moon: 'Triton'
+        },
+        pageId: [ home._id ],
+        pageFields: {
+          [home._id]: {
+            planet: 'Saturn'
+          }
+        },
+        title: 'Sol'
+      };
+      const destination = {
+        _relationship: [
+          {
+            ...home,
+            _fields: {
+              planet: 'Saturn'
+            }
+          }
+        ],
+        array: [
+          {
+            _id: 'Jupiter-Io',
+            planet: 'Jupiter'
+          },
+          {
+            _id: 'Mars-Phobos',
+            planet: 'Mars'
+          }
+        ],
+        object: {
+          _id: 'Neptune-Triton',
+          planet: 'Neptune'
+        },
+        pageId: [ home._id ],
+        pageFields: {
+          [home._id]: {
+            planet: 'Saturn'
+          }
+        },
+        title: 'Default'
+      };
+      await apos.schema.convert(
+        req,
+        schema,
+        data,
+        destination
+      );
+
+      const actual = destination;
+      const expected = {
+        _relationship: [
+          {
+            _fields: {
+              planet: 'Saturn',
+              moon: 'Titan'
+            },
+            ...home
+          }
+        ],
+        array: [
+          {
+            _id: 'Jupiter-Io',
+            metaType: 'arrayItem',
+            moon: 'Io',
+            planet: 'Jupiter',
+            scopedArrayName: undefined
+          },
+          {
+            _id: 'Mars-Phobos',
+            metaType: 'arrayItem',
+            moon: 'Phobos',
+            planet: 'Mars',
+            scopedArrayName: undefined
+          }
+        ],
+        object: {
+          _id: 'Neptune-Triton',
+          metaType: 'objectItem',
+          moon: 'Triton',
+          planet: 'Neptune',
+          scopedObjectName: undefined
+        },
+        pageId: [ home._id ],
+        pageFields: {
+          [home._id]: {
+            planet: 'Saturn'
+          }
+        },
+        title: 'Sol'
+      };
+
+      assert.deepEqual(actual, expected);
+    });
+  });
+
   describe('field editPermission|viewPermission', function() {
     const schema = [
       {