fix: fields general (#93)

* fix: fields general

* test(core): update snapshot

Author: birkir

packages/prime-core/__tests__/modules/__snapshots__/external.ts.snap

@@ -13,6 +13,7 @@ Array [
   Object {
     "description": "Boolean field",
     "options": Object {
+      "default": false,
       "label": "",
     },
     "title": "Boolean",

packages/prime-core/src/utils/DocumentTransformer.ts

@@ -61,10 +61,6 @@ export class DocumentTransformer {
 
       let value = get(data, io === Types.INPUT ? field.name : field.id);
 
-      if (typeof value === 'undefined') {
-        continue;
-      }
-
       if (primeField) {
         if (io === Types.INPUT) {
           value = await primeField.processInput(value);
@@ -73,6 +69,10 @@ export class DocumentTransformer {
         }
       }
 
+      if (typeof value === 'undefined') {
+        continue;
+      }
+
       if (field.parentFieldId && type !== Types.GROUP) {
         continue;
       }

packages/prime-field-boolean/src/PrimeFieldBoolean.ts

@@ -3,6 +3,7 @@ import { GraphQLBoolean } from 'graphql';
 
 interface Options {
   label: string;
+  default: boolean;
 }
 
 export class PrimeFieldBoolean extends PrimeField {
@@ -11,6 +12,7 @@ export class PrimeFieldBoolean extends PrimeField {
   public static description: string = 'Boolean field';
   public static options: Options = {
     label: '',
+    default: false,
   };
 
   public outputType() {
@@ -30,10 +32,18 @@ export class PrimeFieldBoolean extends PrimeField {
   }
 
   public async processInput(value) {
+    if (typeof value === 'undefined') {
+      return this.options.default;
+    }
+
     return Boolean(value);
   }
 
   public async processOutput(value) {
+    if (typeof value === 'undefined') {
+      return this.options.default;
+    }
+
     return Boolean(value);
   }
 }

packages/prime-field-boolean/src/ui/InputComponent.tsx

@@ -4,18 +4,24 @@ import React from 'react';
 
 export class InputComponent extends React.PureComponent<PrimeFieldProps> {
   public render() {
-    const { form, field, path, initialValue = false } = this.props;
+    const { form, field, path, initialValue = this.props.field.options.default } = this.props;
     const { getFieldDecorator } = form;
 
+    const error = form.getFieldError(path);
+    const help =
+      field.description && field.description !== ''
+        ? `${field.description}${error ? ` - ${error}` : ''}`
+        : undefined;
+
     return (
-      <Form.Item label={field.title}>
+      <Form.Item label={field.title} help={help}>
         {getFieldDecorator(path, {
           initialValue,
           valuePropName: 'checked',
         })(<Switch />)}
-        {field.description && field.description !== '' && (
+        {field.options.label && field.options.label !== '' && (
           <label htmlFor={path} style={{ marginLeft: 8 }}>
-            {field.description}
+            {field.options.label}
           </label>
         )}
       </Form.Item>

packages/prime-field-boolean/src/ui/SchemaSettingsComponent.tsx

@@ -1,8 +1,23 @@
 import { PrimeFieldProps } from '@primecms/field';
+import { Form, Input, Switch } from 'antd';
 import React from 'react';
 
-export class SchemaSettingsComponent extends React.PureComponent<PrimeFieldProps> {
+type Props = PrimeFieldProps & {
+  options?: { label: string; default: boolean };
+};
+
+export class SchemaSettingsComponent extends React.PureComponent<Props> {
   public render() {
-    return null;
+    const { form } = this.props;
+    return (
+      <>
+        <Form.Item label="On by default">
+          {form.getFieldDecorator('options.default', {
+            valuePropName: 'checked',
+          })(<Switch />)}
+        </Form.Item>
+        <Form.Item label="Label">{form.getFieldDecorator('options.label')(<Input />)}</Form.Item>
+      </>
+    );
   }
 }

packages/prime-field-datetime/src/ui/SchemaSettingsComponent.tsx

@@ -15,13 +15,13 @@ export class SchemaSettingsComponent extends React.PureComponent<Props> {
     return (
       <>
         <Form.Item label="Options" style={{ marginBottom: -8 }} />
-        <Form.Item>
+        <Form.Item help="Date vs. DateTime">
           {form.getFieldDecorator('options.time', {
             valuePropName: 'checked',
-            initialValue: options.time,
+            initialValue: options.time || true,
           })(<Switch />)}
           <label htmlFor="options.time" style={{ marginLeft: 8 }}>
-            Show time picker
+            Include timestamp
           </label>
         </Form.Item>
       </>

packages/prime-field-group/src/ui/InputComponent.tsx

@@ -3,9 +3,25 @@ import { Button, Card, Form, Icon } from 'antd';
 import { get } from 'lodash';
 import React from 'react';
 
-const { uuid } = window as any;
+const randomByte = () => {
+  const seq = Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(16);
+  return seq.substr(seq.length - 1, 1);
+};
+const randomBytes = length =>
+  Array.from({ length })
+    .map(randomByte)
+    .join('');
+const randomUuid = () => [8, 4, 4, 4, 12].map(randomBytes).join('-');
+
+const { uuid = { v4: randomUuid } } = window as any;
+
+const initialToken = uuid.v4();
+
+const getItems = ({ initialValue, field }: PrimeFieldProps) => {
+  if (!field.options.repeated) {
+    return [[initialToken, 0]];
+  }
 
-const getItems = ({ initialValue }: PrimeFieldProps) => {
   if (Array.isArray(initialValue)) {
     return initialValue.map((_, index) => [uuid.v4(), index]);
   }
@@ -105,6 +121,10 @@ export class InputComponent extends React.PureComponent<PrimeFieldProps, any> {
     const { field } = this.props;
     const repeated = get(field, 'options.repeated', false);
 
+    if (field.fields.length === 0) {
+      return null;
+    }
+
     return (
       <Form.Item label={field.title} className="prime-group">
         {items.map(this.renderGroupItem)}

packages/prime-field-number/src/PrimeFieldNumber.ts

@@ -73,6 +73,11 @@ export class PrimeFieldNumber extends PrimeField {
   public processInput(value) {
     const { rules } = this.options;
     const { name } = this.schemaField;
+
+    if (!this.options.float) {
+      value = parseInt(value, 10);
+    }
+
     const num = Number(value);
 
     if (rules.required) {

packages/prime-ui/src/routes/documents/DocumentsDetail.tsx

@@ -226,17 +226,23 @@ export class DocumentsDetail extends React.Component<IProps> {
 
   public onKeyDown = (e: any) => {
     if (e.which === 83 && (e.ctrlKey || e.metaKey)) {
-      return this.onSave(e);
+      if (e.shiftKey) {
+        return this.onPublish(e);
+      } else {
+        return this.onSave(e);
+      }
     }
     return true;
   };
 
-  public onSave = async (e: React.MouseEvent<HTMLElement>) => {
+  public onSave = async (e: React.MouseEvent<HTMLElement>, feedback = true) => {
     e.preventDefault();
     try {
       const releaseId = this.options.release;
       await this.save({ documentId: this.props.match.params.entryId, releaseId });
-      message.success('Document was saved', 1);
+      if (feedback) {
+        message.success('Document was saved', 1);
+      }
     } catch (err) {
       message.error('Could not save document');
       console.error(err); // tslint:disable-line no-console
@@ -247,6 +253,9 @@ export class DocumentsDetail extends React.Component<IProps> {
   public onPublish = async (e: any) => {
     if (this.contentEntry) {
       this.loading.publish = true;
+      if (this.promptEnabled && this.documentForm!.props.form.isFieldsTouched()) {
+        await this.onSave(e, false);
+      }
       await this.contentEntry.publish();
       message.success('Document was published', 1);
       this.loading.publish = false;

packages/prime-ui/src/routes/schemas/SchemaDetail.tsx

@@ -117,7 +117,9 @@ export class SchemaDetail extends React.Component<IProps> {
   public onKeyDown = (e: any) => {
     if (e.which === 83 && (e.ctrlKey || e.metaKey)) {
       e.preventDefault();
-      this.saveSchema();
+      if (!this.isDrawerOpen) {
+        this.saveSchema();
+      }
       return false;
     }
     return true;