Skip to content

Commit

Permalink
fix: remove withAutoComplete, useCrud / useDatalist adjustments
Browse files Browse the repository at this point in the history
  • Loading branch information
adrians5j committed Sep 13, 2019
1 parent 53e687d commit 6a0e1bc
Show file tree
Hide file tree
Showing 31 changed files with 292 additions and 236 deletions.
16 changes: 9 additions & 7 deletions packages/app-admin/src/contexts/Crud/CrudContext.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
import { useDialog } from "@webiny/app-admin/hooks/useDialog";
import { useDataList } from "@webiny/app/hooks/useDataList";
import useReactRouter from "use-react-router";
import { getData, getError, getMeta } from "./functions";
import { getData, getError } from "./functions";
import { get } from "lodash";
import { i18n } from "@webiny/app/i18n";

Expand All @@ -27,12 +27,13 @@ export const CrudProvider = ({ children, ...props }: Props) => {
const { location, history } = useReactRouter();

const list = useDataList({
name: "dataList",
query: props.list.query,
variables: props.list.variables,
getData: get(props, "list.getData", getData),
getMeta: get(props, "list.getMeta", getMeta),
getError: get(props, "list.getError", getError)
name: "dataList", // TODO: ???
query: get(props, "list.query", props.list),
variables: get(props, "list.variables"),
// "useDataList" will know how to handle no-handler-provided situations.
getData: get(props, "list.getData"),
getMeta: get(props, "list.getMeta"),
getError: get(props, "list.getError")
});

const [mutationInProgress, setMutationInProgress] = useState(false);
Expand Down Expand Up @@ -88,6 +89,7 @@ export const CrudProvider = ({ children, ...props }: Props) => {
list.refresh();
},
save: async (formData: Object) => {
console.log('gooo')
const action = id ? "update" : "create";
setMutationInProgress(true);
setInvalidFields(null);
Expand Down
2 changes: 0 additions & 2 deletions packages/app-admin/src/contexts/Crud/functions/index.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,2 @@
export { default as getData } from "./getData";
export { default as getError } from "./getError";
export { default as getMeta } from "./getMeta";
export { default as searchDataByKey } from "./searchDataByKey";
Original file line number Diff line number Diff line change
@@ -1,20 +1,17 @@
// @flow
import * as React from "react";
import { AutoComplete } from "@webiny/ui/AutoComplete";
import { withAutoComplete } from "@webiny/app/components";
import { get } from "lodash";
import { searchLocaleCodes } from "./graphql";
import { SEARCH_LOCALE_CODES } from "./graphql";
import { useAutocomplete } from "@webiny/app/hooks/useAutocomplete";

const LocaleCodesAutoComplete = props => {
const options = [...props.options];
const autoComplete = useAutocomplete(SEARCH_LOCALE_CODES);
const options = [...autoComplete.options];
if (props.value && !options.includes(props.value)) {
options.push(props.value);
}

return <AutoComplete {...props} options={options} useSimpleValues />;
return <AutoComplete {...props} {...autoComplete} options={options} useSimpleValues />;
};

export default withAutoComplete({
response: data => get(data, "i18n.codes"),
query: searchLocaleCodes
})(LocaleCodesAutoComplete);
export default LocaleCodesAutoComplete;
2 changes: 1 addition & 1 deletion packages/app-i18n/src/admin/views/I18NLocales/graphql.js
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ export const DELETE_LOCALE = gql`
}
`;

export const searchLocaleCodes = gql`
export const SEARCH_LOCALE_CODES = gql`
query searchLocaleCodes($search: String!) {
i18n {
codes: searchLocaleCodes(search: $search) {
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
// @flow
import * as React from "react";
import { AutoComplete } from "@webiny/ui/AutoComplete";
import gql from "graphql-tag";
import { get } from "lodash";
import { Query } from "react-apollo";
import { useAutocomplete } from "@webiny/app/hooks/useAutocomplete";

const GET_CATEGORY = gql`
query getCategory($id: ID!) {
pageBuilder {
getCategory(id: $id) {
data {
id
name
}
}
}
}
`;

const LIST_CATEGORIES = gql`
query listCategories($search: PbSearchInput) {
pageBuilder {
categories: listCategories(search: $search) {
data {
id
name
}
}
}
}
`;

export function CategoriesAutocomplete(props) {
const autoComplete = useAutocomplete({
search: query => ({ query, fields: ["name"] }),
query: LIST_CATEGORIES
});

return (
<Query skip={!props.value} variables={{ id: props.value }} query={GET_CATEGORY}>
{({ data }) => (
<AutoComplete {...props} {...autoComplete} value={get(data, "pageBuilder.getCategory.data")}/>
)}
</Query>
);
}
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
// @flow
import * as React from "react";
import { AutoComplete } from "@webiny/ui/AutoComplete";
import { withAutoComplete } from "@webiny/app/components";
import gql from "graphql-tag";
import { get } from "lodash";
import { Query } from "react-apollo";
import { useAutocomplete } from "@webiny/app/hooks/useAutocomplete";

// We utilize the same "listPages" GraphQL field.
const getPage = gql`
const GET_PAGE = gql`
query getPublishedPage($parent: String) {
pageBuilder {
page: getPublishedPage(parent: $parent) {
Expand All @@ -21,7 +21,7 @@ const getPage = gql`
}
`;

const listPages = gql`
const LIST_PUBLISHED_PAGES = gql`
query listPublishedPages($search: String) {
pageBuilder {
pages: listPublishedPages(search: $search) {
Expand All @@ -35,16 +35,23 @@ const listPages = gql`
}
`;

export const PagesAutoComplete = withAutoComplete({
response: data => get(data, "pageBuilder.pages"),
query: listPages
})(props => (
<Query skip={!props.value} variables={{ parent: props.value }} query={getPage}>
{({ data }) => {
const value = get(data, "pageBuilder.page.data");
return (
<AutoComplete {...props} valueProp={"parent"} textProp={"title"} value={value} />
);
}}
</Query>
));
export function PagesAutocomplete(props) {
const autoComplete = useAutocomplete(LIST_PUBLISHED_PAGES);

return (
<Query skip={!props.value} variables={{ parent: props.value }} query={GET_PAGE}>
{({ data }) => {
const value = get(data, "pageBuilder.page.data");
return (
<AutoComplete
{...props}
{...autoComplete}
valueProp={"parent"}
textProp={"title"}
value={value}
/>
);
}}
</Query>
);
}

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
// @flow
import * as React from "react";
import { MultiAutoComplete as UiMultiAutoComplete } from "@webiny/ui/AutoComplete";
import { useAutocomplete } from "@webiny/app/hooks/useAutocomplete";
import gql from "graphql-tag";

const SEARCH_TAGS = gql`
query searchTags($search: String!) {
pageBuilder {
tags: searchTags(query: $search) {
data
}
}
}
`;

export function TagsMultiAutocomplete(props) {
const autoComplete = useAutocomplete({
search: query => query,
query: SEARCH_TAGS
});
return (
<UiMultiAutoComplete
{...props}
{...autoComplete}
label="Tags"
useSimpleValues
allowFreeInput
/>
);
}
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { Input } from "@webiny/ui/Input";
import { Typography } from "@webiny/ui/Typography";
import { Grid, Cell } from "@webiny/ui/Grid";
import { ButtonSecondary, ButtonPrimary } from "@webiny/ui/Button";
import { PagesAutoComplete } from "@webiny/app-page-builder/admin/components/PagesAutoComplete";
import { PagesAutocomplete } from "@webiny/app-page-builder/admin/components/PagesAutocomplete";
import { Elevation } from "@webiny/ui/Elevation";
import { validation } from "@webiny/validation";

Expand All @@ -25,7 +25,7 @@ const LinkForm = ({ data, onSubmit, onCancel }: Object) => {
<Cell span={12}>
<Bind name="page" validators={validation.create("required")}>
{({ onChange, ...rest }) => (
<PagesAutoComplete
<PagesAutocomplete
{...rest}
onChange={(value, selection) => {
onChange(value);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ import { Typography } from "@webiny/ui/Typography";
import { Grid, Cell } from "@webiny/ui/Grid";
import { ButtonSecondary, ButtonPrimary } from "@webiny/ui/Button";
import { Select } from "@webiny/ui/Select";
import { TagsMultiAutoComplete } from "@webiny/app-page-builder/admin/components/TagsMultiAutoComplete";
import { CategoriesAutoComplete } from "@webiny/app-page-builder/admin/components/CategoriesAutoComplete";
import { TagsMultiAutocomplete } from "@webiny/app-page-builder/admin/components/TagsMultiAutocomplete";
import { CategoriesAutocomplete } from "@webiny/app-page-builder/admin/components/CategoriesAutocomplete";
import { Elevation } from "@webiny/ui/Elevation";
import { validation } from "@webiny/validation";

Expand All @@ -33,7 +33,7 @@ const LinkForm = ({ data, onSubmit, onCancel }: Object) => {
<Grid>
<Cell span={12}>
<Bind name="category" validators={validation.create("required")}>
<CategoriesAutoComplete label="Category" />
<CategoriesAutocomplete label="Category" />
</Bind>
</Cell>
</Grid>
Expand All @@ -53,7 +53,11 @@ const LinkForm = ({ data, onSubmit, onCancel }: Object) => {
</Grid>
<Grid>
<Cell span={12}>
<Bind name="sortDir" defaultValue={"-1"} validators={validation.create("required")}>
<Bind
name="sortDir"
defaultValue={"-1"}
validators={validation.create("required")}
>
<Select label="Sort direction...">
<option value="1">Ascending</option>
<option value="-1">Descending</option>
Expand All @@ -64,15 +68,18 @@ const LinkForm = ({ data, onSubmit, onCancel }: Object) => {
<Grid>
<Cell span={12}>
<Bind name="tags">
<TagsMultiAutoComplete />
<TagsMultiAutocomplete />
</Bind>
</Cell>
</Grid>
<Grid>
<Cell span={12}>
{get(data, "tags.length", 0) > 0 && (
<Bind name="tagsRule" defaultValue={"ALL"}>
<Select label="Tags rule..." validators={validation.create("required")}>
<Select
label="Tags rule..."
validators={validation.create("required")}
>
<option value="ALL">Must include all tags</option>
<option value="ANY">
Must include any of the tags
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { ButtonPrimary } from "@webiny/ui/Button";
import { Query, Mutation } from "react-apollo";
import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
import graphql from "./graphql";
import { PagesAutoComplete } from "@webiny/app-page-builder/admin/components/PagesAutoComplete";
import { PagesAutocomplete } from "@webiny/app-page-builder/admin/components/PagesAutocomplete";
import { CircularProgress } from "@webiny/ui/Progress";
import SingleImageUpload from "@webiny/app-admin/components/SingleImageUpload";
import { get } from "lodash";
Expand Down Expand Up @@ -52,23 +52,23 @@ const PageBuilderSettings = () => {
<Grid>
<Cell span={12}>
<Bind name={"pages.home"}>
<PagesAutoComplete
<PagesAutocomplete
label={"Homepage"}
description={`This is the homepage of your website.`}
/>
</Bind>
</Cell>
<Cell span={12}>
<Bind name={"pages.error"}>
<PagesAutoComplete
<PagesAutocomplete
label={"Error page"}
description={`Shown when an error occurs during a page load.`}
/>
</Bind>
</Cell>
<Cell span={12}>
<Bind name={"pages.notFound"}>
<PagesAutoComplete
<PagesAutocomplete
label={"Not found (404) page"}
description={`Shown when the requested page is not found.`}
/>
Expand Down
Loading

0 comments on commit 6a0e1bc

Please sign in to comment.