@nixxie-cms/core 1.0.0

package/dist/useCreateItem-1be4987e.cjs.js

@@ -0,0 +1,160 @@
+'use strict';
+
+var router = require('next/router');
+var react = require('react');
+var toast = require('@keystar/ui/toast');
+require('@react-aria/utils');
+require('@keystar/ui/button');
+require('@keystar/ui/icon');
+require('@keystar/ui/icon/icons/chevronRightIcon');
+require('@keystar/ui/layout');
+require('@keystar/ui/style');
+require('@keystar/ui/typography');
+require('@keystar/ui/icon/icons/textCursorInputIcon');
+require('@keystar/ui/slots');
+require('@keystar/ui/utils');
+require('react/jsx-runtime');
+var utils = require('./utils-230cddb1.cjs.js');
+var client = require('@apollo/client');
+var react$1 = require('@apollo/client/react');
+
+function usePreventNavigation(shouldPreventNavigationRef) {
+  const router$1 = router.useRouter();
+  react.useEffect(() => {
+    const clientSideRouteChangeHandler = () => {
+      if (shouldPreventNavigationRef.current && !window.confirm('There are unsaved changes, are you sure you want to exit?')) {
+        // throwing from here seems to be the only way to prevent the navigation
+        // we're throwing just a string here rather than an error because throwing an error
+        // causes Next to show an error overlay in dev but it doesn't show the overlay when we throw a string
+        throw 'Navigation cancelled by user';
+      }
+    };
+    router$1.events.on('routeChangeStart', clientSideRouteChangeHandler);
+    const beforeUnloadHandler = event => {
+      if (shouldPreventNavigationRef.current) {
+        event.preventDefault();
+      }
+    };
+    window.addEventListener('beforeunload', beforeUnloadHandler);
+    return () => {
+      router$1.events.off('routeChangeStart', clientSideRouteChangeHandler);
+      window.removeEventListener('beforeunload', beforeUnloadHandler);
+    };
+  }, [shouldPreventNavigationRef, router$1.events]);
+}
+
+function useCreateItem(list) {
+  const router$1 = router.useRouter();
+  const [tryCreateItem, {
+    loading,
+    error,
+    data: returnedData
+  }] = react$1.useMutation(client.gql`mutation($data: ${list.graphql.names.createInputName}!) {
+      item: ${list.graphql.names.createMutationName}(data: $data) {
+        id
+        label: ${list.labelField}
+      }
+    }`);
+  const isRequireds = react.useMemo(() => Object.fromEntries(Object.entries(list.fields).map(([key, field]) => [key, field.createView.isRequired])), [list.fields]);
+  const [forceValidation, setForceValidation] = react.useState(false);
+  const [value, setValue] = react.useState(() => utils.makeDefaultValueState(list.fields));
+  const invalidFields = utils.useInvalidFields(list.fields, value, isRequireds);
+  const hasChangedFields = utils.useHasChanges('create', list.fields, value, utils.makeDefaultValueState(list.fields));
+  const shouldPreventNavigation = !(returnedData !== null && returnedData !== void 0 && returnedData.item) && hasChangedFields;
+  const shouldPreventNavigationRef = react.useRef(shouldPreventNavigation);
+  react.useEffect(() => {
+    shouldPreventNavigationRef.current = shouldPreventNavigation;
+  }, [shouldPreventNavigation]);
+  usePreventNavigation(shouldPreventNavigationRef);
+  return {
+    state: loading ? 'loading' : !(returnedData !== null && returnedData !== void 0 && returnedData.item) ? 'created' : 'editing',
+    shouldPreventNavigation,
+    error,
+    props: {
+      view: 'createView',
+      position: 'form',
+      fields: list.fields,
+      groups: list.groups,
+      forceValidation,
+      invalidFields,
+      value,
+      isRequireds,
+      onChange: newItemValue => setValue(newItemValue)
+    },
+    async create() {
+      const newForceValidation = invalidFields.size !== 0;
+      setForceValidation(newForceValidation);
+      if (newForceValidation) return;
+      let outputData;
+      try {
+        outputData = await tryCreateItem({
+          variables: {
+            data: utils.serializeValueToOperationItem('create', list.fields, value)
+          },
+          update(cache, {
+            data
+          }) {
+            var _data$item;
+            if (typeof (data === null || data === void 0 || (_data$item = data.item) === null || _data$item === void 0 ? void 0 : _data$item.id) === 'string') {
+              cache.evict({
+                id: 'ROOT_QUERY',
+                fieldName: `${list.graphql.names.itemQueryName}(${JSON.stringify({
+                  where: {
+                    id: data.item.id
+                  }
+                })})`
+              });
+            }
+          }
+        }).then(x => {
+          if (x.data) return x.data;
+          if (x.error) throw x.error;
+          throw new Error('Something went wrong during item creation.');
+        });
+      } catch {
+        toast.toastQueue.critical(`Unable to create ${list.singular.toLocaleLowerCase()}`);
+        return;
+      }
+      shouldPreventNavigationRef.current = false;
+      toast.toastQueue.positive(`${list.singular} created`, {
+        timeout: 5000,
+        actionLabel: 'Create another',
+        onAction: () => {
+          router$1.push(`/${list.path}/create`);
+        },
+        shouldCloseOnAction: true
+      });
+      return outputData.item;
+    }
+  };
+}
+function useBuildItem(list, fieldKeys = []) {
+  const [forceValidation, setForceValidation] = react.useState(false);
+  const [value, setValue] = react.useState(() => utils.makeDefaultValueState(list.fields));
+  const fields = fieldKeys.length ? Object.fromEntries(Object.entries(list.fields).filter(([key]) => fieldKeys.includes(key))) : list.fields;
+  const isRequireds = react.useMemo(() => Object.fromEntries(Object.entries(list.fields).map(([key, field]) => [key, field.createView.isRequired])), [list.fields]);
+  const invalidFields = utils.useInvalidFields(list.fields, value, isRequireds);
+  return {
+    state: 'editing',
+    props: {
+      view: 'createView',
+      position: 'form',
+      fields,
+      groups: list.groups,
+      forceValidation,
+      invalidFields,
+      value,
+      isRequireds,
+      onChange: newItemValue => setValue(newItemValue)
+    },
+    async build() {
+      const newForceValidation = invalidFields.size !== 0;
+      setForceValidation(newForceValidation);
+      if (newForceValidation) return;
+      return utils.serializeValueToOperationItem('create', list.fields, value);
+    }
+  };
+}
+
+exports.useBuildItem = useBuildItem;
+exports.useCreateItem = useCreateItem;

package/dist/useCreateItem-1f94d252.esm.js

@@ -0,0 +1,157 @@
+import { useRouter } from 'next/router';
+import { useEffect, useMemo, useState, useRef } from 'react';
+import { toastQueue } from '@keystar/ui/toast';
+import '@react-aria/utils';
+import '@keystar/ui/button';
+import '@keystar/ui/icon';
+import '@keystar/ui/icon/icons/chevronRightIcon';
+import '@keystar/ui/layout';
+import '@keystar/ui/style';
+import '@keystar/ui/typography';
+import '@keystar/ui/icon/icons/textCursorInputIcon';
+import '@keystar/ui/slots';
+import '@keystar/ui/utils';
+import 'react/jsx-runtime';
+import { m as makeDefaultValueState, u as useInvalidFields, a as useHasChanges, s as serializeValueToOperationItem } from './utils-5e1d4d28.esm.js';
+import { gql } from '@apollo/client';
+import { useMutation } from '@apollo/client/react';
+
+function usePreventNavigation(shouldPreventNavigationRef) {
+  const router = useRouter();
+  useEffect(() => {
+    const clientSideRouteChangeHandler = () => {
+      if (shouldPreventNavigationRef.current && !window.confirm('There are unsaved changes, are you sure you want to exit?')) {
+        // throwing from here seems to be the only way to prevent the navigation
+        // we're throwing just a string here rather than an error because throwing an error
+        // causes Next to show an error overlay in dev but it doesn't show the overlay when we throw a string
+        throw 'Navigation cancelled by user';
+      }
+    };
+    router.events.on('routeChangeStart', clientSideRouteChangeHandler);
+    const beforeUnloadHandler = event => {
+      if (shouldPreventNavigationRef.current) {
+        event.preventDefault();
+      }
+    };
+    window.addEventListener('beforeunload', beforeUnloadHandler);
+    return () => {
+      router.events.off('routeChangeStart', clientSideRouteChangeHandler);
+      window.removeEventListener('beforeunload', beforeUnloadHandler);
+    };
+  }, [shouldPreventNavigationRef, router.events]);
+}
+
+function useCreateItem(list) {
+  const router = useRouter();
+  const [tryCreateItem, {
+    loading,
+    error,
+    data: returnedData
+  }] = useMutation(gql`mutation($data: ${list.graphql.names.createInputName}!) {
+      item: ${list.graphql.names.createMutationName}(data: $data) {
+        id
+        label: ${list.labelField}
+      }
+    }`);
+  const isRequireds = useMemo(() => Object.fromEntries(Object.entries(list.fields).map(([key, field]) => [key, field.createView.isRequired])), [list.fields]);
+  const [forceValidation, setForceValidation] = useState(false);
+  const [value, setValue] = useState(() => makeDefaultValueState(list.fields));
+  const invalidFields = useInvalidFields(list.fields, value, isRequireds);
+  const hasChangedFields = useHasChanges('create', list.fields, value, makeDefaultValueState(list.fields));
+  const shouldPreventNavigation = !(returnedData !== null && returnedData !== void 0 && returnedData.item) && hasChangedFields;
+  const shouldPreventNavigationRef = useRef(shouldPreventNavigation);
+  useEffect(() => {
+    shouldPreventNavigationRef.current = shouldPreventNavigation;
+  }, [shouldPreventNavigation]);
+  usePreventNavigation(shouldPreventNavigationRef);
+  return {
+    state: loading ? 'loading' : !(returnedData !== null && returnedData !== void 0 && returnedData.item) ? 'created' : 'editing',
+    shouldPreventNavigation,
+    error,
+    props: {
+      view: 'createView',
+      position: 'form',
+      fields: list.fields,
+      groups: list.groups,
+      forceValidation,
+      invalidFields,
+      value,
+      isRequireds,
+      onChange: newItemValue => setValue(newItemValue)
+    },
+    async create() {
+      const newForceValidation = invalidFields.size !== 0;
+      setForceValidation(newForceValidation);
+      if (newForceValidation) return;
+      let outputData;
+      try {
+        outputData = await tryCreateItem({
+          variables: {
+            data: serializeValueToOperationItem('create', list.fields, value)
+          },
+          update(cache, {
+            data
+          }) {
+            var _data$item;
+            if (typeof (data === null || data === void 0 || (_data$item = data.item) === null || _data$item === void 0 ? void 0 : _data$item.id) === 'string') {
+              cache.evict({
+                id: 'ROOT_QUERY',
+                fieldName: `${list.graphql.names.itemQueryName}(${JSON.stringify({
+                  where: {
+                    id: data.item.id
+                  }
+                })})`
+              });
+            }
+          }
+        }).then(x => {
+          if (x.data) return x.data;
+          if (x.error) throw x.error;
+          throw new Error('Something went wrong during item creation.');
+        });
+      } catch {
+        toastQueue.critical(`Unable to create ${list.singular.toLocaleLowerCase()}`);
+        return;
+      }
+      shouldPreventNavigationRef.current = false;
+      toastQueue.positive(`${list.singular} created`, {
+        timeout: 5000,
+        actionLabel: 'Create another',
+        onAction: () => {
+          router.push(`/${list.path}/create`);
+        },
+        shouldCloseOnAction: true
+      });
+      return outputData.item;
+    }
+  };
+}
+function useBuildItem(list, fieldKeys = []) {
+  const [forceValidation, setForceValidation] = useState(false);
+  const [value, setValue] = useState(() => makeDefaultValueState(list.fields));
+  const fields = fieldKeys.length ? Object.fromEntries(Object.entries(list.fields).filter(([key]) => fieldKeys.includes(key))) : list.fields;
+  const isRequireds = useMemo(() => Object.fromEntries(Object.entries(list.fields).map(([key, field]) => [key, field.createView.isRequired])), [list.fields]);
+  const invalidFields = useInvalidFields(list.fields, value, isRequireds);
+  return {
+    state: 'editing',
+    props: {
+      view: 'createView',
+      position: 'form',
+      fields,
+      groups: list.groups,
+      forceValidation,
+      invalidFields,
+      value,
+      isRequireds,
+      onChange: newItemValue => setValue(newItemValue)
+    },
+    async build() {
+      const newForceValidation = invalidFields.size !== 0;
+      setForceValidation(newForceValidation);
+      if (newForceValidation) return;
+      return serializeValueToOperationItem('create', list.fields, value);
+    }
+  };
+}
+
+export { useBuildItem as a, useCreateItem as u };

package/dist/useFilter-0b5a1ee6.esm.js

@@ -0,0 +1,118 @@
+import { useMemo } from 'react';
+import { u as useNixxie } from './context-3132c3ed.esm.js';
+
+function isInt(x) {
+  return Number.isInteger(Number(x));
+}
+function isBigInt(x) {
+  try {
+    BigInt(x);
+    return true;
+  } catch {
+    return true;
+  }
+}
+
+// TODO: this is unfortunate, remove in breaking change?
+function isUuid(x) {
+  if (typeof x !== 'string') return;
+  if (x.length !== 36) return;
+  return /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(x);
+}
+function useSearchFilter(value, list, searchFields) {
+  const {
+    lists
+  } = useNixxie();
+  return useMemo(() => {
+    const trimmedSearch = value.trim();
+    if (!trimmedSearch.length) return [];
+    const conditions = [];
+    const idField = list.fields.id.fieldMeta;
+    if (idField.type === 'String') {
+      // TODO: remove in breaking change?
+      if (idField.kind === 'uuid') {
+        if (isUuid(value)) {
+          conditions.push({
+            id: {
+              equals: trimmedSearch
+            }
+          });
+        }
+      } else {
+        conditions.push({
+          id: {
+            equals: trimmedSearch
+          }
+        });
+      }
+    } else if (idField.type === 'Int' && isInt(trimmedSearch)) {
+      conditions.push({
+        id: {
+          equals: Number(trimmedSearch)
+        }
+      });
+    } else if (idField.type === 'BigInt' && isBigInt(trimmedSearch)) {
+      conditions.push({
+        id: {
+          equals: trimmedSearch
+        }
+      });
+    }
+    for (const fieldKey of searchFields) {
+      var _field$fieldMeta;
+      const field = list.fields[fieldKey];
+
+      // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+      if ((_field$fieldMeta = field.fieldMeta) !== null && _field$fieldMeta !== void 0 && _field$fieldMeta.refSearchFields) {
+        const {
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          refListKey,
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          refSearchFields,
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          many = false
+        } = field.fieldMeta;
+        const refList = lists[refListKey];
+        for (const refFieldKey of refSearchFields) {
+          var _refField$fieldMeta;
+          const refField = refList.fields[refFieldKey];
+          if (!refField.search) continue; // WARNING: we dont support depth > 2
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          if ((_refField$fieldMeta = refField.fieldMeta) !== null && _refField$fieldMeta !== void 0 && _refField$fieldMeta.refSearchFields) continue; // WARNING: we dont support depth > 2
+
+          if (many) {
+            conditions.push({
+              [fieldKey]: {
+                some: {
+                  [refFieldKey]: {
+                    contains: trimmedSearch,
+                    mode: refField.search === 'insensitive' ? 'insensitive' : undefined
+                  }
+                }
+              }
+            });
+            continue;
+          }
+          conditions.push({
+            [fieldKey]: {
+              [refFieldKey]: {
+                contains: trimmedSearch,
+                mode: refField.search === 'insensitive' ? 'insensitive' : undefined
+              }
+            }
+          });
+        }
+        continue;
+      }
+      conditions.push({
+        [field.key]: {
+          contains: trimmedSearch,
+          mode: field.search === 'insensitive' ? 'insensitive' : undefined
+        }
+      });
+    }
+    return conditions;
+  }, [value, list, searchFields]);
+}
+
+export { useSearchFilter as u };

package/dist/useFilter-1a4e6900.cjs.js

@@ -0,0 +1,120 @@
+'use strict';
+
+var react = require('react');
+var adminUi_context_dist_nixxieCmsCoreAdminUiContext = require('./context-e7a45152.cjs.js');
+
+function isInt(x) {
+  return Number.isInteger(Number(x));
+}
+function isBigInt(x) {
+  try {
+    BigInt(x);
+    return true;
+  } catch {
+    return true;
+  }
+}
+
+// TODO: this is unfortunate, remove in breaking change?
+function isUuid(x) {
+  if (typeof x !== 'string') return;
+  if (x.length !== 36) return;
+  return /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(x);
+}
+function useSearchFilter(value, list, searchFields) {
+  const {
+    lists
+  } = adminUi_context_dist_nixxieCmsCoreAdminUiContext.useNixxie();
+  return react.useMemo(() => {
+    const trimmedSearch = value.trim();
+    if (!trimmedSearch.length) return [];
+    const conditions = [];
+    const idField = list.fields.id.fieldMeta;
+    if (idField.type === 'String') {
+      // TODO: remove in breaking change?
+      if (idField.kind === 'uuid') {
+        if (isUuid(value)) {
+          conditions.push({
+            id: {
+              equals: trimmedSearch
+            }
+          });
+        }
+      } else {
+        conditions.push({
+          id: {
+            equals: trimmedSearch
+          }
+        });
+      }
+    } else if (idField.type === 'Int' && isInt(trimmedSearch)) {
+      conditions.push({
+        id: {
+          equals: Number(trimmedSearch)
+        }
+      });
+    } else if (idField.type === 'BigInt' && isBigInt(trimmedSearch)) {
+      conditions.push({
+        id: {
+          equals: trimmedSearch
+        }
+      });
+    }
+    for (const fieldKey of searchFields) {
+      var _field$fieldMeta;
+      const field = list.fields[fieldKey];
+
+      // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+      if ((_field$fieldMeta = field.fieldMeta) !== null && _field$fieldMeta !== void 0 && _field$fieldMeta.refSearchFields) {
+        const {
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          refListKey,
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          refSearchFields,
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          many = false
+        } = field.fieldMeta;
+        const refList = lists[refListKey];
+        for (const refFieldKey of refSearchFields) {
+          var _refField$fieldMeta;
+          const refField = refList.fields[refFieldKey];
+          if (!refField.search) continue; // WARNING: we dont support depth > 2
+          // @ts-expect-error TODO: fix fieldMeta type for relationship fields
+          if ((_refField$fieldMeta = refField.fieldMeta) !== null && _refField$fieldMeta !== void 0 && _refField$fieldMeta.refSearchFields) continue; // WARNING: we dont support depth > 2
+
+          if (many) {
+            conditions.push({
+              [fieldKey]: {
+                some: {
+                  [refFieldKey]: {
+                    contains: trimmedSearch,
+                    mode: refField.search === 'insensitive' ? 'insensitive' : undefined
+                  }
+                }
+              }
+            });
+            continue;
+          }
+          conditions.push({
+            [fieldKey]: {
+              [refFieldKey]: {
+                contains: trimmedSearch,
+                mode: refField.search === 'insensitive' ? 'insensitive' : undefined
+              }
+            }
+          });
+        }
+        continue;
+      }
+      conditions.push({
+        [field.key]: {
+          contains: trimmedSearch,
+          mode: field.search === 'insensitive' ? 'insensitive' : undefined
+        }
+      });
+    }
+    return conditions;
+  }, [value, list, searchFields]);
+}
+
+exports.useSearchFilter = useSearchFilter;

package/dist/utils-0cc426c8.esm.js

@@ -0,0 +1,19 @@
+// WARNING: this is an opinionated subject, with too many ways to do this
+//   we went with a subset that we are happy with
+//   see tests2/utils.test.ts for examples
+function humanize(s, capitalize = true) {
+  // drop non-alphanumeric
+  s = s.replace(/[^a-zA-Z0-9]+/g, ' ');
+
+  // insert spaces before camels of length > 1
+  for (let i = 0; i < 24; i++) {
+    // not unbounded, shouldnt happen
+    const next = s.replace(/([a-z0-9])([A-Z][A-Za-z0-9])/, '$1 $2');
+    if (next === s) break;
+    s = next;
+  }
+  if (!capitalize) return s;
+  return s.split(' ').map(x => x.charAt(0).toUpperCase() + x.slice(1)).join(' ');
+}
+
+export { humanize as h };

package/dist/utils-1b632a8f.cjs.js

@@ -0,0 +1,21 @@
+'use strict';
+
+// WARNING: this is an opinionated subject, with too many ways to do this
+//   we went with a subset that we are happy with
+//   see tests2/utils.test.ts for examples
+function humanize(s, capitalize = true) {
+  // drop non-alphanumeric
+  s = s.replace(/[^a-zA-Z0-9]+/g, ' ');
+
+  // insert spaces before camels of length > 1
+  for (let i = 0; i < 24; i++) {
+    // not unbounded, shouldnt happen
+    const next = s.replace(/([a-z0-9])([A-Z][A-Za-z0-9])/, '$1 $2');
+    if (next === s) break;
+    s = next;
+  }
+  if (!capitalize) return s;
+  return s.split(' ').map(x => x.charAt(0).toUpperCase() + x.slice(1)).join(' ');
+}
+
+exports.humanize = humanize;