@blaze-cms/plugin-data-ui 0.133.0-admin-updates.0 → 0.133.0-project-admin-customisations.0

package/src/components/ListingTable/mappers/populate-rows.js

@@ -3,18 +3,22 @@ import { Link } from 'react-router-dom';
 import TableActions from '../TableActions';
 import { ACTIONS } from '../../../constants';
 
-const formatRows = ({ rows, url, toggleModal, label, firstColumn = 'name' }) =>
+const formatRows = ({ rows, url, toggleModal, label, firstColumn = 'name', isEnquiry }) =>
   rows.map(data => {
     const editUrl = `${url}/update/${data.id}`;
-    return {
+    const rowProps = {
       ...data,
       [firstColumn]: (
         <Link to={editUrl} role="button">
           {data[firstColumn]}
         </Link>
-      ),
-      actions: <TableActions editUrl={editUrl} data={data} showDeleteModal={toggleModal} />
+      )
     };
+    if (!isEnquiry)
+      rowProps.actions = (
+        <TableActions editUrl={editUrl} data={data} showDeleteModal={toggleModal} />
+      );
+    return rowProps;
   });
 
 const getSanitizedColumnLabel = columnProp => {
@@ -28,22 +32,82 @@ const getSanitizedColumnLabel = columnProp => {
   return sanitizedChar;
 };
 
-const getColumnLabels = (listingProperties, properties, dynamicProperties) => {
-  const allProperties = { ...properties, ...dynamicProperties };
-  return listingProperties.reduce((acc, listingProperty) => {
-    const label = allProperties[listingProperty].label || getSanitizedColumnLabel(listingProperty);
-    return { ...acc, ...{ [listingProperty]: label } };
-  }, {});
+const buildArrayRowContent = rowData => (
+  <div className="table-row-list">
+    {rowData.map(rowGroup => (
+      <div className="table-row-list__group">
+        {rowGroup.map(({ label, value, url }) => (
+          <div className="table-row-list__group__item">
+            <span className="table-row-list__group__item__label"> {label}:</span>
+            {url ? (
+              <Link to={url} role="button" className="table-row-list__group__item__value">
+                {value}
+              </Link>
+            ) : (
+              <span className="table-row-list__group__item__value"> {value}</span>
+            )}
+          </div>
+        ))}
+      </div>
+    ))}
+  </div>
+);
+
+const buildArrayRowData = rowData => {
+  const dataGroups = [];
+  const groups = Math.ceil(rowData.length / 3) || 1;
+  for (let index = 0; index < groups; index += 1) {
+    const currentStart = index * groups;
+    dataGroups[index] = rowData.slice(currentStart, currentStart + 3);
+  }
+
+  return buildArrayRowContent(dataGroups);
+};
+
+const getParsedRowData = rows =>
+  rows.map(rowData =>
+    Object.keys(rowData).reduce((acc, key) => {
+      const parsedData = Array.isArray(rowData[key])
+        ? buildArrayRowData(rowData[key])
+        : rowData[key];
+      return { ...acc, [key]: parsedData };
+    }, {})
+  );
+
+const getColumnsAndLabels = (listingProperties, allProperties, rows) => {
+  const columns = [];
+  const labels = {};
+
+  listingProperties.forEach(listingProperty => {
+    const propKey = listingProperty.includes(' ') ? listingProperty.split(' ')[0] : listingProperty;
+    const { label } = allProperties[propKey] || {};
+    columns.push(propKey);
+    labels[propKey] = label || getSanitizedColumnLabel(propKey);
+  });
+  const parsedRowData = getParsedRowData(rows);
+
+  return { columns, labels, parsedRowData };
 };
 
 const populateRows = ({ toggleModal, url, entitySchema, rows }) => {
-  const { listingProperties, properties, dynamicProperties = {}, formProperties } = entitySchema;
-  const columns = [...listingProperties, ACTIONS];
+  const {
+    id: schemaId,
+    listingProperties,
+    properties,
+    dynamicProperties = {},
+    formProperties
+  } = entitySchema;
+
+  const isEnquiry = schemaId === 'enquiry';
+  const columnOptions = !isEnquiry ? [...listingProperties, ACTIONS] : [...listingProperties];
+
+  const allProperties = { ...properties, ...dynamicProperties };
+  const { columns, labels, parsedRowData } = getColumnsAndLabels(
+    columnOptions,
+    allProperties,
+    rows
+  );
   const [firstColumn] = columns;
-  const labels = {
-    ...getColumnLabels(listingProperties, properties, dynamicProperties),
-    [ACTIONS]: ACTIONS
-  };
 
   return {
     identification: 'id',
@@ -51,8 +115,9 @@ const populateRows = ({ toggleModal, url, entitySchema, rows }) => {
     columns,
     labels,
     orderBy: [...formProperties],
-    rows: formatRows({ firstColumn, rows, url, toggleModal })
+    rows: formatRows({ firstColumn, rows: parsedRowData, url, toggleModal, isEnquiry }),
+    isEnquiry
   };
 };
 
-export { populateRows, formatRows };
+export { populateRows, formatRows, getParsedRowData };

package/src/components/ListingTable/service/index.js

@@ -1,12 +1,49 @@
 import buildListingQuery from '../../../utils/build-listing-query';
 
-const fetchData = async ({ client, querySettings: { entitySchema, queryParams } }) => {
-  const query = buildListingQuery(entitySchema);
+function buildVariables({ entitySchema, isSearchQuery, listFilters = [], queryParams = {} }) {
+  const { identifier } = entitySchema;
+  const { sort, offset, limit, where } = queryParams;
+  const [{ property, direction }] = sort;
+  const parsedOffset = `${property}:${direction}`;
+
+  if (!isSearchQuery)
+    return {
+      ...queryParams,
+      where: !Array.isArray(listFilters) ? listFilters : where
+    };
+
+  const rawQuery = {
+    bool: {
+      must: listFilters || [],
+      filter: [
+        {
+          term: {
+            entityIdentifier: identifier
+          }
+        }
+      ]
+    }
+  };
+
+  return {
+    limit,
+    offset,
+    sort: parsedOffset,
+    where: JSON.stringify(rawQuery)
+  };
+}
+
+const fetchData = async ({ client, querySettings: { entitySchema, queryParams }, listFilters }) => {
   const {
-    data: { listingData }
-  } = await client.query({ query, variables: queryParams, fetchPolicy: 'network-only' });
+    displayProperties: { adminListings: { dataSource: { source } = {} } = {} } = {}
+  } = entitySchema;
+
+  const isSearchQuery = source === 'search';
+  const query = buildListingQuery(entitySchema, isSearchQuery);
+  const variables = buildVariables({ entitySchema, listFilters, queryParams, isSearchQuery });
+  const { data = {} } = await client.query({ query, variables, fetchPolicy: 'network-only' });
 
-  return listingData;
+  return data.searchResults ? data.searchResults.results : data.listingData;
 };
 
 export { fetchData };

package/src/index.js

@@ -12,14 +12,7 @@ const EntityManager = React.lazy(() =>
 );
 
 export default async function load(app) {
-  // To load different plugin information into menu
-  const sectionKey = 'content';
-
-  app.events.once('load:menu-section', addSection => {
-    addSection(sectionKey, { header: 'content', order: 100 });
-  });
-
-  app.events.once('load:menu-items', getAddContentMenuItems(app, sectionKey));
+  app.events.once('admin:menu:config:load', getAddContentMenuItems(app));
 
   app.events.once('load:custom:field:type', addFieldType => {
     Object.keys(formFieldTypes).forEach(type => {

package/src/utils/add-content-menu-items.js

@@ -2,8 +2,8 @@ import { getQuery } from '@blaze-cms/admin-ui-utils';
 
 const { MENU_PERMISSIONS } = require('../constants');
 
-function getAddContentMenuItems(app, sectionKey) {
-  return async addItem => {
+function getAddContentMenuItems(app) {
+  return async ({ addConfig }) => {
     const client = app.getClient();
     const {
       data: { getEntitySchemas }
@@ -14,9 +14,51 @@ function getAddContentMenuItems(app, sectionKey) {
         canDoActions: MENU_PERMISSIONS
       }
     });
+
+    if (!getEntitySchemas || !getEntitySchemas.length) return; // no items so don't add section
+
+    const menuItems = {};
+    const sectionMenuItems = { content: {} };
+
+    getEntitySchemas.forEach(({ id, displayName, displayProperties }) => {
+      if (!displayProperties) return null;
+
+      const { adminMenu: { sectionKey = 'content' } = {} } = displayProperties;
+      const sectionItems = sectionMenuItems[sectionKey] || {};
+      sectionItems[id] = {
+        label: displayName,
+        uri: `/data-listing/${id}`
+      };
+      sectionMenuItems[sectionKey] = sectionItems;
+    });
+
+    const menuConfig = {
+      main: {
+        items: {
+          content: {
+            label: 'Content',
+            loadOpen: true,
+            order: 10,
+            items: menuItems
+          }
+        }
+      }
+    };
+
+    Object.entries(sectionMenuItems).forEach(([sectionKey, sectionItems]) => {
+      const sectionConfig = menuConfig.main.items[sectionKey] || {};
+      sectionConfig.items = sectionItems;
+      menuConfig.main.items[sectionKey] = sectionConfig;
+    });
+
     getEntitySchemas.forEach(({ id, displayName }) => {
-      addItem({ name: displayName, uri: `/data-listing/${id}` }, sectionKey);
+      menuItems[id] = {
+        label: displayName,
+        uri: `/data-listing/${id}`
+      };
     });
+
+    addConfig(menuConfig);
   };
 }
 

package/src/utils/build-listing-query.js

@@ -1,13 +1,23 @@
 import { gql } from '@apollo/client';
 import { BlazeError } from '@blaze-cms/core-errors';
+import { getDynamicQuery } from '@blaze-cms/admin-ui-utils';
 
-function buildListingQuery(entitySchema) {
+const buildAdminSearchQuery = entitySchema => {
+  const { listingProperties = [] } = entitySchema || {};
+  const parsedProperties = `id, ${listingProperties.join(' ') || 'id name'}`;
+
+  return getDynamicQuery('ADMIN_SEARCH')([entitySchema], parsedProperties, true);
+};
+
+function buildListingQuery(entitySchema, isSearchQuery) {
   if (!entitySchema.actions || !entitySchema.actions.getAll || !entitySchema.listingProperties) {
     throw new BlazeError(
       'Listing query requires getAll action and listingProperties from entity schema'
     );
   }
 
+  if (isSearchQuery) return buildAdminSearchQuery(entitySchema);
+
   const sortType =
     entitySchema.actions.getAll[0].toUpperCase() + entitySchema.actions.getAll.substr(1);
 

package/src/utils/get-default-query-params.js

@@ -1,4 +1,4 @@
-const getDefaultQueryParams = ({ schema }) => {
+const getDefaultQueryParams = schema => {
   const updated = schema.properties && schema.properties.updated;
   const { adminDefaultListingFilter: where } = schema.displayProperties || {};