-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Add fragments folder alias * Add Project Search page * Add Fields and Entity Edit pages * Add Records, Fields search pages * Move getEntities, getRecord to RecordForm to prevent duplication * Remove extra variable * Trim search text before search * Remove `recursiveKeyValuesToJSON` * review changes
- Loading branch information
1 parent
da8c2cb
commit 1d57011
Showing
21 changed files
with
914 additions
and
318 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -32,6 +32,9 @@ | |
| ], | ||
| "styles/*": [ | ||
| "styles/*" | ||
| ], | ||
| "fragments/*": [ | ||
| "fragments/*" | ||
| ] | ||
| } | ||
| }, | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| import React from 'react' | ||
| import { Field, Form } from 'react-final-form' | ||
|
|
||
| import FilledButton from 'components/buttons/FilledButton' | ||
| import FormFooter from 'components/internal/FormFooter' | ||
| import TextInput from 'components/inputs/TextInput' | ||
|
|
||
| function ProjectSearchForm(props) { | ||
| return ( | ||
| <Form | ||
| render={({ handleSubmit, submitting }) => ( | ||
| <form onSubmit={handleSubmit}> | ||
| <Field name="search" component={TextInput} placeholder="Search..." stretched={false} /> | ||
| <FormFooter> | ||
| <FilledButton label="Search" disabled={submitting} /> | ||
| </FormFooter> | ||
| </form> | ||
| )} | ||
| {...props} | ||
| /> | ||
| ) | ||
| } | ||
|
|
||
| export default ProjectSearchForm |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,119 @@ | ||
| import _ from 'lodash' | ||
| import gql from 'graphql-tag' | ||
| import injectSheet from 'react-jss' | ||
| import React, { Fragment } from 'react' | ||
|
|
||
| import FieldForm from 'components/internal/forms/FieldForm' | ||
| import Loader from 'components/internal/Loader' | ||
| import Spacer from 'components/Spacer' | ||
| import withConfirmation from 'components/internal/decorators/withConfirmation' | ||
| import { DialogTitle } from 'components/internal/typography' | ||
| import { Field } from 'models' | ||
| import { MutationResponseModes, withMutation, withQuery } from 'lib/data' | ||
| import { showAlertSuccess } from 'client/methods' | ||
| import FIELD_FRAGMENTS from 'fragments/fields' | ||
|
|
||
| function FieldsEditPage({ | ||
| entities = [], | ||
| fields = [], | ||
| loading, | ||
| match, | ||
| updateField, | ||
| history | ||
| }) { | ||
| const handleFormSubmit = values => updateField(values, { onSuccess: () => { | ||
| const { teamId, projectId, entityId } = match.params | ||
| const path = `/teams/${teamId}/projects/${projectId}/entities/${entityId}/fields` | ||
| showAlertSuccess({ message: 'Successfully updated field' }) | ||
| history.push(path) | ||
| } }) | ||
|
|
||
| if (loading) { | ||
| return <Loader record={{ loading: true }} /> | ||
| } | ||
|
|
||
| const processedFields = Field.process(fields) | ||
| const field = processedFields.find(f => f.id === match.params.fieldId) | ||
| const title = `Edit Field #${field.label}` | ||
|
|
||
| return ( | ||
| <Fragment> | ||
| <DialogTitle>{title}</DialogTitle> | ||
| <Spacer height={30} /> | ||
| <FieldForm | ||
| initialValues={field} | ||
| onSubmit={handleFormSubmit} | ||
| entities={entities} | ||
| /> | ||
| <Spacer height={30} /> | ||
| </Fragment> | ||
| ) | ||
| } | ||
|
|
||
| FieldsEditPage = injectSheet(({ colors, typography }) => ({ | ||
| entityName: { | ||
| ...typography.semibold, | ||
|
|
||
| alignItems: 'center', | ||
| color: colors.text_dark, | ||
| display: 'flex', | ||
| lineHeight: 1 | ||
| } | ||
| }))(FieldsEditPage) | ||
|
|
||
| FieldsEditPage = withMutation(gql` | ||
| mutation UpdateFieldMutation($id: ID!, $input: UpdateFieldInput!) { | ||
| updateField(id: $id, input: $input) { | ||
| ...Field_fields | ||
| } | ||
| } | ||
| ${FIELD_FRAGMENTS.fields} | ||
| `, { | ||
| inputFilter: gql` | ||
| fragment UpdateFieldInput on UpdateFieldInput { | ||
| id | ||
| children | ||
| dataType | ||
| validations | ||
| settings | ||
| defaultValue | ||
| elementType | ||
| hint | ||
| label | ||
| name | ||
| position | ||
| referencedEntityId | ||
| } | ||
| `, | ||
| mode: MutationResponseModes.CUSTOM, | ||
| updateData: ({ cachedData, responseRecords }) => { | ||
| const currentRecords = cachedData.fields | ||
| cachedData.fields = _.unionWith(currentRecords, responseRecords, _.isEqual) | ||
| } | ||
| })(FieldsEditPage) | ||
|
|
||
| FieldsEditPage = withQuery(gql` | ||
| query GetFieldsAndEntities($entityId: ID!, $projectId: ID!) { | ||
| fields(entityId: $entityId) { | ||
| ...Field_fields | ||
| } | ||
| entities(projectId: $projectId) { | ||
| id | ||
| label | ||
| name | ||
| } | ||
| } | ||
| ${FIELD_FRAGMENTS.fields} | ||
| `, { | ||
| options: ({ match }) => ({ | ||
| variables: { | ||
| entityId: match.params.entityId, | ||
| projectId: match.params.projectId | ||
| } | ||
| }) | ||
| })(FieldsEditPage) | ||
|
|
||
| export default withConfirmation()(FieldsEditPage) |
Oops, something went wrong.