From 8afe11c0329ab69208e286c594d1d978b781413f Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 21 Aug 2019 16:30:56 +0200 Subject: [PATCH 01/24] Add plugin page, plugin list view --- package-lock.json | 41 +++-- src/configuration/index.tsx | 76 ++++++++ src/icons/Plugins.tsx | 17 ++ src/index.tsx | 6 + .../components/PluginsList/PluginsList.tsx | 167 ++++++++++++++++++ src/plugins/components/PluginsList/index.ts | 2 + .../PluginsListPage/PluginsListPage.tsx | 55 ++++++ .../components/PluginsListPage/index.ts | 2 + src/plugins/index.tsx | 47 +++++ src/plugins/mutations.ts | 0 src/plugins/queries.ts | 68 +++++++ src/plugins/types/pluginConfigurations.ts | 36 ++++ src/plugins/types/pluginFragment.ts | 15 ++ src/plugins/urls.ts | 21 +++ src/plugins/views/PluginsList.tsx | 81 +++++++++ .../__snapshots__/Stories.test.ts.snap | 41 +++++ 16 files changed, 664 insertions(+), 11 deletions(-) create mode 100644 src/icons/Plugins.tsx create mode 100644 src/plugins/components/PluginsList/PluginsList.tsx create mode 100644 src/plugins/components/PluginsList/index.ts create mode 100644 src/plugins/components/PluginsListPage/PluginsListPage.tsx create mode 100644 src/plugins/components/PluginsListPage/index.ts create mode 100644 src/plugins/index.tsx create mode 100644 src/plugins/mutations.ts create mode 100644 src/plugins/queries.ts create mode 100644 src/plugins/types/pluginConfigurations.ts create mode 100644 src/plugins/types/pluginFragment.ts create mode 100644 src/plugins/urls.ts create mode 100644 src/plugins/views/PluginsList.tsx diff --git a/package-lock.json b/package-lock.json index 8bf2228c5..cdfa829e5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9409,7 +9409,8 @@ }, "ansi-regex": { "version": "2.1.1", - "bundled": true + "bundled": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -9427,11 +9428,13 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true + "bundled": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -9444,15 +9447,18 @@ }, "code-point-at": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "concat-map": { "version": "0.0.1", - "bundled": true + "bundled": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -9555,7 +9561,8 @@ }, "inherits": { "version": "2.0.3", - "bundled": true + "bundled": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -9565,6 +9572,7 @@ "is-fullwidth-code-point": { "version": "1.0.0", "bundled": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -9577,17 +9585,20 @@ "minimatch": { "version": "3.0.4", "bundled": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } }, "minimist": { "version": "0.0.8", - "bundled": true + "bundled": true, + "optional": true }, "minipass": { "version": "2.3.5", "bundled": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -9604,6 +9615,7 @@ "mkdirp": { "version": "0.5.1", "bundled": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -9676,7 +9688,8 @@ }, "number-is-nan": { "version": "1.0.1", - "bundled": true + "bundled": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -9686,6 +9699,7 @@ "once": { "version": "1.4.0", "bundled": true, + "optional": true, "requires": { "wrappy": "1" } @@ -9761,7 +9775,8 @@ }, "safe-buffer": { "version": "5.1.2", - "bundled": true + "bundled": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -9791,6 +9806,7 @@ "string-width": { "version": "1.0.2", "bundled": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -9808,6 +9824,7 @@ "strip-ansi": { "version": "3.0.1", "bundled": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -9846,11 +9863,13 @@ }, "wrappy": { "version": "1.0.2", - "bundled": true + "bundled": true, + "optional": true }, "yallist": { "version": "3.0.3", - "bundled": true + "bundled": true, + "optional": true } } }, diff --git a/src/configuration/index.tsx b/src/configuration/index.tsx index 1c991472a..97ab04c36 100644 --- a/src/configuration/index.tsx +++ b/src/configuration/index.tsx @@ -7,6 +7,7 @@ import useNavigator from "@saleor/hooks/useNavigator"; import useUser from "@saleor/hooks/useUser"; import Navigation from "@saleor/icons/Navigation"; import Pages from "@saleor/icons/Pages"; +import Plugins from "@saleor/icons/Plugins"; import ProductTypes from "@saleor/icons/ProductTypes"; import ShippingMethods from "@saleor/icons/ShippingMethods"; import SiteSettings from "@saleor/icons/SiteSettings"; @@ -16,6 +17,7 @@ import { sectionNames } from "@saleor/intl"; import { maybe } from "@saleor/misc"; import { menuListUrl } from "@saleor/navigation/urls"; import { pageListUrl } from "@saleor/pages/urls"; +import { pluginsListUrl } from "@saleor/plugins/urls"; import { productTypeListUrl } from "@saleor/productTypes/urls"; import { shippingZonesListUrl } from "@saleor/shipping/urls"; import { siteSettingsUrl } from "@saleor/siteSettings/urls"; @@ -24,6 +26,7 @@ import { taxSection } from "@saleor/taxes/urls"; import { PermissionEnum } from "@saleor/types/globalTypes"; import ConfigurationPage, { MenuItem } from "./ConfigurationPage"; +<<<<<<< HEAD export function createConfigurationMenu(intl: IntlShape): MenuItem[] { return [ { @@ -108,6 +111,79 @@ export function createConfigurationMenu(intl: IntlShape): MenuItem[] { } ]; } +======= +export const configurationMenu: MenuItem[] = [ + { + description: i18n.t("Determine attributes used to create product types"), + icon: , + permission: PermissionEnum.MANAGE_PRODUCTS, + title: i18n.t("Attributes"), + url: attributeListUrl() + }, + { + description: i18n.t("Define types of products you sell"), + icon: , + permission: PermissionEnum.MANAGE_PRODUCTS, + title: i18n.t("Product Types"), + url: productTypeListUrl() + }, + { + description: i18n.t("Manage your employees and their permissions"), + icon: , + permission: PermissionEnum.MANAGE_STAFF, + title: i18n.t("Staff Members"), + url: staffListUrl() + }, + { + description: i18n.t("Manage how you ship out orders."), + icon: , + permission: PermissionEnum.MANAGE_SHIPPING, + title: i18n.t("Shipping Methods"), + url: shippingZonesListUrl() + }, + { + description: i18n.t("Manage how your store charges tax"), + icon: , + permission: PermissionEnum.MANAGE_PRODUCTS, + title: i18n.t("Taxes"), + url: taxSection + }, + { + description: i18n.t("Define how users can navigate through your store"), + icon: , + permission: PermissionEnum.MANAGE_MENUS, + title: i18n.t("Navigation"), + url: menuListUrl() + }, + { + description: i18n.t("View and update your site settings"), + icon: , + permission: PermissionEnum.MANAGE_SETTINGS, + title: i18n.t("Site Settings"), + url: siteSettingsUrl() + }, + { + description: i18n.t("Manage and add additional pages"), + icon: , + permission: PermissionEnum.MANAGE_PAGES, + title: i18n.t("Pages"), + url: pageListUrl() + }, + { + description: i18n.t("View and update your plugins and their settings."), + icon: ( + + ), + permission: PermissionEnum.MANAGE_SETTINGS, + title: i18n.t("Plugins"), + url: pluginsListUrl() + } +]; +>>>>>>> Add plugin page, plugin list view export const configurationMenuUrl = "/configuration/"; diff --git a/src/icons/Plugins.tsx b/src/icons/Plugins.tsx new file mode 100644 index 000000000..4f67c5b5a --- /dev/null +++ b/src/icons/Plugins.tsx @@ -0,0 +1,17 @@ +import createSvgIcon from "@material-ui/icons/utils/createSvgIcon"; +import React from "react"; + +export const Plugins = createSvgIcon( + <> + + + + +); +Plugins.displayName = "Plugins"; +export default Plugins; diff --git a/src/index.tsx b/src/index.tsx index 48e1bb36a..02ec5af46 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -39,6 +39,7 @@ import { navigationSection } from "./navigation/urls"; import { NotFound } from "./NotFound"; import OrdersSection from "./orders"; import PageSection from "./pages"; +import PluginsSection from "./plugins"; import ProductSection from "./products"; import ProductTypesSection from "./productTypes"; import ShippingSection from "./shipping"; @@ -171,6 +172,11 @@ const Routes: React.FC = () => { path="/pages" component={PageSection} /> + + createStyles({ + [theme.breakpoints.up("lg")]: { + colActive: {}, + colName: {}, + colAction: { + textAlign: "right", + "& svg": { + color: theme.palette.primary.main + } + } + }, + colName: {}, + colActive: {}, + colAction: {}, + link: { + cursor: "pointer" + } + }); + +const numberOfColumns = 4; + +const PluginList = withStyles(styles, { name: "PageList" })( + ({ + classes, + settings, + plugins, + disabled, + onNextPage, + pageInfo, + onRowClick, + onUpdateListSettings, + onPreviousPage, + isChecked, + selected, + toggle, + toggleAll, + toolbar + }: PluginListProps & WithStyles) => { + console.log(plugins); + return ( + + + + + {i18n.t("Name", { context: "table header" })} + + + {i18n.t("Active", { context: "table header" })} + + + {i18n.t("Action", { context: "table header" })} + + + + + + + + + {renderCollection( + plugins, + plugin => { + const isSelected = plugin ? isChecked(plugin.id) : false; + + return ( + + + toggle(plugin.id)} + /> + + + {maybe(() => plugin.name, )} + + + {maybe( + () => ( + + ), + + )} + + +
+ +
+ + + ); + }, + () => ( + + + {i18n.t("No plugins found")} + + + ) + )} + +
+ + ); + } +); +PluginList.displayName = "PluginList"; +export default PluginList; diff --git a/src/plugins/components/PluginsList/index.ts b/src/plugins/components/PluginsList/index.ts new file mode 100644 index 000000000..f8d1b14d3 --- /dev/null +++ b/src/plugins/components/PluginsList/index.ts @@ -0,0 +1,2 @@ +export { default } from "./PluginsList"; +export * from "./PluginsList"; diff --git a/src/plugins/components/PluginsListPage/PluginsListPage.tsx b/src/plugins/components/PluginsListPage/PluginsListPage.tsx new file mode 100644 index 000000000..5375117ae --- /dev/null +++ b/src/plugins/components/PluginsListPage/PluginsListPage.tsx @@ -0,0 +1,55 @@ +import Button from "@material-ui/core/Button"; +import AddIcon from "@material-ui/icons/Add"; +import React from "react"; + +import AppHeader from "@saleor/components/AppHeader"; +import Container from "@saleor/components/Container"; +import PageHeader from "@saleor/components/PageHeader"; +import i18n from "@saleor/i18n"; +import { ListActions, PageListProps } from "@saleor/types"; +import { PageList_pages_edges_node } from "../../types/PageList"; +import PluginsList from "../PluginsList/PluginsList"; + +export interface PluginsListPageProps extends PageListProps, ListActions { + pages: PageList_pages_edges_node[]; + onBack: () => void; +} + +const PluginsListPage: React.StatelessComponent = ({ + disabled, + settings, + onBack, + onNextPage, + onPreviousPage, + onRowClick, + onUpdateListSettings, + pageInfo, + plugins, + isChecked, + selected, + toggle, + toggleAll, + toolbar +}) => ( + + {i18n.t("Configuration")} + + + +); +PluginsListPage.displayName = "PluginsListPage"; +export default PluginsListPage; diff --git a/src/plugins/components/PluginsListPage/index.ts b/src/plugins/components/PluginsListPage/index.ts new file mode 100644 index 000000000..37ed6f973 --- /dev/null +++ b/src/plugins/components/PluginsListPage/index.ts @@ -0,0 +1,2 @@ +export { default } from "./PluginsListPage"; +export * from "./PluginsListPage"; diff --git a/src/plugins/index.tsx b/src/plugins/index.tsx new file mode 100644 index 000000000..651efd012 --- /dev/null +++ b/src/plugins/index.tsx @@ -0,0 +1,47 @@ +import { parse as parseQs } from "qs"; +import React from "react"; +import { Route, RouteComponentProps, Switch } from "react-router-dom"; + +import { WindowTitle } from "../components/WindowTitle"; +import i18n from "../i18n"; +import { + pluginsPath, + pluginsListPath, + PluginsListUrlQueryParams +} from "./urls"; +import PluginsDetailsComponent from "./views/PluginsDetails"; +import PluginsListComponent from "./views/PluginsList"; + +const PluginList: React.StatelessComponent> = ({ + location +}) => { + const qs = parseQs(location.search.substr(1)); + const params: PluginsListUrlQueryParams = qs; + return ; +}; + +// const PageDetails: React.StatelessComponent> = ({ +// match +// }) => { +// const qs = parseQs(location.search.substr(1)); +// const params: PluginsListUrlQueryParams = qs; + +// return ( +// +// ); +// }; + +const Component = () => ( + <> + + + + {/* */} + + +); + +export default Component; diff --git a/src/plugins/mutations.ts b/src/plugins/mutations.ts new file mode 100644 index 000000000..e69de29bb diff --git a/src/plugins/queries.ts b/src/plugins/queries.ts new file mode 100644 index 000000000..dfdf1cd69 --- /dev/null +++ b/src/plugins/queries.ts @@ -0,0 +1,68 @@ +import gql from "graphql-tag"; + +import { TypedQuery } from "../queries"; +import { PluginDetails, PluginDetailsVariables } from "./types/PluginDetails"; +import { PluginsList, PluginsListVariables } from "./types/PluginsList"; + +export const pluginsFragment = gql` + fragment pluginFragment on PluginConfiguration { + id + name + description + active + } +`; + +// export const pluginsDetailsFragment = gql` +// ${pluginsFragment} +// fragment pluginsDetailsFragment on PluginConfiguration { +// ...pluginFragment +// configuration { +// name +// type +// value +// helpText +// label +// } +// } +// `; + +const pluginsList = gql` + ${pluginsFragment} + query pluginConfigurations( + $first: Int + $after: String + $last: Int + $before: String + ) { + pluginConfigurations( + before: $before + after: $after + first: $first + last: $last + ) { + edges { + node { + ...pluginFragment + } + } + } + } +`; +export const TypedPluginsListQuery = TypedQuery< + PluginsList, + PluginsListVariables +>(pluginsList); + +// const pluginsDetails = gql` +// ${pluginsDetailsFragment} +// query pluginConfiguration($id: ID!) { +// page(id: $id) { +// ...pluginsDetailsFragment +// } +// } +// `; +// export const TypedPluginsDetailsQuery = TypedQuery< +// PluginDetails, +// PluginDetailsVariables +// >(pluginsDetails); diff --git a/src/plugins/types/pluginConfigurations.ts b/src/plugins/types/pluginConfigurations.ts new file mode 100644 index 000000000..3204a58d7 --- /dev/null +++ b/src/plugins/types/pluginConfigurations.ts @@ -0,0 +1,36 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +// ==================================================== +// GraphQL query operation: pluginConfigurations +// ==================================================== + +export interface pluginConfigurations_pluginConfigurations_edges_node { + __typename: "PluginConfiguration"; + id: string; + name: string; + description: string; + active: boolean; +} + +export interface pluginConfigurations_pluginConfigurations_edges { + __typename: "PluginConfigurationCountableEdge"; + node: pluginConfigurations_pluginConfigurations_edges_node; +} + +export interface pluginConfigurations_pluginConfigurations { + __typename: "PluginConfigurationCountableConnection"; + edges: pluginConfigurations_pluginConfigurations_edges[]; +} + +export interface pluginConfigurations { + pluginConfigurations: pluginConfigurations_pluginConfigurations | null; +} + +export interface pluginConfigurationsVariables { + first?: number | null; + after?: string | null; + last?: number | null; + before?: string | null; +} diff --git a/src/plugins/types/pluginFragment.ts b/src/plugins/types/pluginFragment.ts new file mode 100644 index 000000000..a1e6f5f6c --- /dev/null +++ b/src/plugins/types/pluginFragment.ts @@ -0,0 +1,15 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +// ==================================================== +// GraphQL fragment: pluginFragment +// ==================================================== + +export interface pluginFragment { + __typename: "PluginConfiguration"; + id: string; + name: string; + description: string; + active: boolean; +} diff --git a/src/plugins/urls.ts b/src/plugins/urls.ts new file mode 100644 index 000000000..c2bb025e7 --- /dev/null +++ b/src/plugins/urls.ts @@ -0,0 +1,21 @@ +import { stringify as stringifyQs } from "qs"; +import urlJoin from "url-join"; + +import { BulkAction, Dialog, Pagination, SingleAction } from "../types"; + +export const pluginsSection = "/plugins/"; + +export const pluginsListPath = pluginsSection; +export type PluginsListUrlDialog = "remove" | "remove-many"; +export type PluginsListUrlQueryParams = BulkAction & + Dialog & + Pagination & + SingleAction; +export const pluginsListUrl = (params?: PluginsListUrlQueryParams) => + pluginsListPath + "?" + stringifyQs(params); + +export const pluginsPath = (id: string) => urlJoin(pluginsSection, id); +export type PluginsUrlDialog = "edit-item" | "remove"; +export type PluginsUrlQueryParams = Dialog & SingleAction; +export const pluginsUrl = (id: string, params?: PluginsUrlQueryParams) => + pluginsPath(encodeURIComponent(id)) + "?" + stringifyQs(params); diff --git a/src/plugins/views/PluginsList.tsx b/src/plugins/views/PluginsList.tsx new file mode 100644 index 000000000..ef954a175 --- /dev/null +++ b/src/plugins/views/PluginsList.tsx @@ -0,0 +1,81 @@ +import Button from "@material-ui/core/Button"; +import DialogContentText from "@material-ui/core/DialogContentText"; +import IconButton from "@material-ui/core/IconButton"; +import DeleteIcon from "@material-ui/icons/Delete"; +import React from "react"; + +import ActionDialog from "@saleor/components/ActionDialog"; +import { configurationMenuUrl } from "@saleor/configuration"; +import useBulkActions from "@saleor/hooks/useBulkActions"; +import useListSettings from "@saleor/hooks/useListSettings"; +import useNavigator from "@saleor/hooks/useNavigator"; +import useNotifier from "@saleor/hooks/useNotifier"; +import usePaginator, { + createPaginationState +} from "@saleor/hooks/usePaginator"; +import i18n from "@saleor/i18n"; +import { getMutationState, maybe } from "@saleor/misc"; +import { ListViews } from "@saleor/types"; +import PluginsListPage from "../components/PluginsListPage/PluginsListPage"; +import { TypedPluginsListQuery } from "../queries"; +import { + pluginsListUrl, + PluginsListUrlDialog, + PluginsListUrlQueryParams, + pluginsUrl +} from "../urls"; + +interface PluginsListProps { + params: PluginsListUrlQueryParams; +} + +export const PluginsList: React.StatelessComponent = ({ + params +}) => { + const navigate = useNavigator(); + const notify = useNotifier(); + const paginate = usePaginator(); + const { isSelected, listElements, reset, toggle, toggleAll } = useBulkActions( + params.ids + ); + const { updateListSettings, settings } = useListSettings( + ListViews.PAGES_LIST + ); + const paginationState = createPaginationState(settings.rowNumber, params); + + return ( + + {({ data, loading, refetch }) => { + const { loadNextPage, loadPreviousPage, pageInfo } = paginate( + maybe(() => data.pages.pageInfo), + paginationState, + params + ); + + return ( + <> + + data.pluginConfigurations.edges.map(edge => edge.node) + )} + pageInfo={pageInfo} + onBack={() => navigate(configurationMenuUrl)} + onNextPage={loadNextPage} + onPreviousPage={loadPreviousPage} + onUpdateListSettings={updateListSettings} + onRowClick={id => () => navigate(pluginsUrl(id))} + isChecked={isSelected} + selected={listElements.length} + toggle={toggle} + toggleAll={toggleAll} + /> + + ); + }} + + ); +}; + +export default PluginsList; diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap index 0b6f69afe..a34423093 100644 --- a/src/storybook/__snapshots__/Stories.test.ts.snap +++ b/src/storybook/__snapshots__/Stories.test.ts.snap @@ -26660,6 +26660,47 @@ exports[`Storyshots Views / Configuration default 1`] = ` +
+
+
+ +
+
+

+ Plugins +

+

+ View and update your plugins and their settings. +

+
+
+
From 4cfb408d5ec9924bea85ac5184c17ae6491d8bdc Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Mon, 26 Aug 2019 19:08:32 +0200 Subject: [PATCH 02/24] Add pluginDetails --- .../components/PluginInfo/PluginInfo.tsx | 91 +++++++++++ src/plugins/components/PluginInfo/index.ts | 2 + .../PluginSettings/PluginSettings.tsx | 83 ++++++++++ .../components/PluginSettings/index.ts | 2 + .../PluginsDetailsPage/PluginsDetailsPage.tsx | 147 ++++++++++++++++++ .../components/PluginsDetailsPage/index.ts | 2 + .../components/PluginsList/PluginsList.tsx | 3 +- src/plugins/index.tsx | 26 ++-- src/plugins/mutations.ts | 30 ++++ src/plugins/queries.ts | 50 +++--- src/plugins/views/PluginsDetails.tsx | 88 +++++++++++ 11 files changed, 484 insertions(+), 40 deletions(-) create mode 100644 src/plugins/components/PluginInfo/PluginInfo.tsx create mode 100644 src/plugins/components/PluginInfo/index.ts create mode 100644 src/plugins/components/PluginSettings/PluginSettings.tsx create mode 100644 src/plugins/components/PluginSettings/index.ts create mode 100644 src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx create mode 100644 src/plugins/components/PluginsDetailsPage/index.ts create mode 100644 src/plugins/views/PluginsDetails.tsx diff --git a/src/plugins/components/PluginInfo/PluginInfo.tsx b/src/plugins/components/PluginInfo/PluginInfo.tsx new file mode 100644 index 000000000..b3b288c2f --- /dev/null +++ b/src/plugins/components/PluginInfo/PluginInfo.tsx @@ -0,0 +1,91 @@ +import Card from "@material-ui/core/Card"; +import CardContent from "@material-ui/core/CardContent"; +import { + createStyles, + Theme, + withStyles, + WithStyles +} from "@material-ui/core/styles"; +import TextField from "@material-ui/core/TextField"; +import Typography from "@material-ui/core/Typography"; +import React from "react"; + +import CardTitle from "@saleor/components/CardTitle"; +import ControlledSwitch from "@saleor/components/ControlledSwitch"; +import FormSpacer from "@saleor/components/FormSpacer"; +import Hr from "@saleor/components/Hr"; +import i18n from "../../../i18n"; +import { FormData } from "../PluginsDetailsPage"; + +interface PluginInfoProps { + data: FormData; + errors: Partial<{ + description: string; + domain: string; + name: string; + }>; + disabled: boolean; + onChange: (event: React.ChangeEvent) => void; +} + +const styles = (theme: Theme) => + createStyles({ + title: { + fontSize: 14, + color: "#616161", + paddingTop: 10 + }, + status: { + fontSize: 16, + color: "#3D3D3D", + paddingTop: 20, + fontWeight: "400" + } + }); + +const PluginInfo = withStyles(styles, { name: "PluginInfo" })( + ({ + data, + disabled, + classes, + errors, + onChange + }: PluginInfoProps & WithStyles) => { + return ( + + + + + {i18n.t("Plugin Name")} + + {data.name} + {data.description && ( + <> + + {i18n.t("Plugin Description")} + + {data.description} + + )} + +
+ + {i18n.t("Status")} + + + + + ); + } +); +PluginInfo.displayName = "PluginInfo"; +export default PluginInfo; diff --git a/src/plugins/components/PluginInfo/index.ts b/src/plugins/components/PluginInfo/index.ts new file mode 100644 index 000000000..f2a38dc4e --- /dev/null +++ b/src/plugins/components/PluginInfo/index.ts @@ -0,0 +1,2 @@ +export { default } from "./PluginInfo"; +export * from "./PluginInfo"; diff --git a/src/plugins/components/PluginSettings/PluginSettings.tsx b/src/plugins/components/PluginSettings/PluginSettings.tsx new file mode 100644 index 000000000..2927f9ed4 --- /dev/null +++ b/src/plugins/components/PluginSettings/PluginSettings.tsx @@ -0,0 +1,83 @@ +import Card from "@material-ui/core/Card"; +import CardContent from "@material-ui/core/CardContent"; +import ControlledSwitch from "@saleor/components/ControlledSwitch"; +import { + createStyles, + Theme, + withStyles, + WithStyles +} from "@material-ui/core/styles"; +import TextField from "@material-ui/core/TextField"; +import Typography from "@material-ui/core/Typography"; +import React from "react"; + +import CardTitle from "@saleor/components/CardTitle"; +import FormSpacer from "@saleor/components/FormSpacer"; +import i18n from "../../../i18n"; +import { FormData } from "../PluginsDetailsPage"; + +interface PluginSettingsProps { + data: FormData; + errors: Partial<{ + description: string; + domain: string; + name: string; + }>; + disabled: boolean; + onChange: (event: React.ChangeEvent) => void; +} + +const styles = (theme: Theme) => + createStyles({ + item: { + marginBottom: 5, + marginTop: 10 + } + }); + +const PluginSettings = withStyles(styles, { name: "PluginSettings" })( + ({ + data, + disabled, + classes, + errors, + onChange + }: PluginSettingsProps & WithStyles) => ( + + + + {data.configuration.map((configuration, index) => ( +
+ {configuration.type === "STRING" && ( + + )} + {configuration.type === "BOOLEAN" && ( + + )} +
+ ))} + + + ); +); +PluginSettings.displayName = "PluginSettings"; +export default PluginSettings; diff --git a/src/plugins/components/PluginSettings/index.ts b/src/plugins/components/PluginSettings/index.ts new file mode 100644 index 000000000..422ec9e3c --- /dev/null +++ b/src/plugins/components/PluginSettings/index.ts @@ -0,0 +1,2 @@ +export { default } from "./PluginSettings"; +export * from "./PluginSettings"; diff --git a/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx b/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx new file mode 100644 index 000000000..f68947787 --- /dev/null +++ b/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx @@ -0,0 +1,147 @@ +import React from "react"; +import Typography from "@material-ui/core/Typography"; +import AppHeader from "@saleor/components/AppHeader"; +import CardSpacer from "@saleor/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton"; +import Container from "@saleor/components/Container"; +import Form from "@saleor/components/Form"; +import Grid from "@saleor/components/Grid"; +import PageHeader from "@saleor/components/PageHeader"; +import SaveButtonBar from "@saleor/components/SaveButtonBar"; +import SeoForm from "@saleor/components/SeoForm"; +import VisibilityCard from "@saleor/components/VisibilityCard"; +import i18n from "../../../i18n"; +import { maybe } from "../../../misc"; +import { UserError } from "../../../types"; +import { PageDetails_page } from "../../types/PluginDetails"; +import PluginInfo from "../PluginInfo"; +import PluginSettings from "../PluginSettings"; + +export interface FormData { + name: string; + description: string; + active: boolean; + id: string; + configuration: [ + { + name: string; + value: string; + type: string; + helpText: string; + label: string; + } + ]; +} + +export interface PageDetailsPageProps { + disabled: boolean; + errors: UserError[]; + plugin: PageDetails_page; + saveButtonBarState: ConfirmButtonTransitionState; + onBack: () => void; + onSubmit: (data: FormData) => void; +} + +const PageDetailsPage: React.StatelessComponent = ({ + disabled, + errors, + plugin, + saveButtonBarState, + onBack, + onSubmit +}) => { + const initialForm: FormData = { + name: maybe(() => plugin.name, ""), + description: maybe(() => plugin.description, ""), + active: maybe(() => plugin.active, false), + configuration: maybe(() => plugin.configuration, []) + }; + return ( +
+ {({ + change, + data, + errors: formErrors, + hasChanged, + submit, + set, + triggerChange + }) => { + const newData = { + active: data.active, + configuration: data.configuration + }; + + const onChange = event => { + const { name, value } = event.target; + name === "active" + ? (newData.active = value) + : (newData.active = data.active); + + newData.configuration.map(item => { + if (item.name === name) { + item.value = value; + } + }); + + triggerChange(); + set(newData); + }; + return ( + + {i18n.t("Plugins")} + plugin.name, "")} ${i18n.t("Details")}`} + /> + +
+ + {i18n.t("Plugin Information and Status")} + + + {i18n.t( + "These are general information about your store. They define what is the URL of your store and what is shown in brow sers taskbar." + )} + +
+ + {data.configuration && ( + <> +
+ + {i18n.t("Plugin Settings")} + + + {i18n.t( + "This adress will be used to generate invoices and calculate shipping rates. Email adress you provide here will be used as a contact adress for your customers." + )} + +
+ + + )} + + + + ); + }} +
+ ); +}; +PageDetailsPage.displayName = "PageDetailsPage"; +export default PageDetailsPage; diff --git a/src/plugins/components/PluginsDetailsPage/index.ts b/src/plugins/components/PluginsDetailsPage/index.ts new file mode 100644 index 000000000..f38ee22f8 --- /dev/null +++ b/src/plugins/components/PluginsDetailsPage/index.ts @@ -0,0 +1,2 @@ +export { default } from "./PluginsDetailsPage"; +export * from "./PluginsDetailsPage"; diff --git a/src/plugins/components/PluginsList/PluginsList.tsx b/src/plugins/components/PluginsList/PluginsList.tsx index 5a895c9b9..0086d3559 100644 --- a/src/plugins/components/PluginsList/PluginsList.tsx +++ b/src/plugins/components/PluginsList/PluginsList.tsx @@ -49,7 +49,7 @@ const styles = (theme: Theme) => const numberOfColumns = 4; -const PluginList = withStyles(styles, { name: "PageList" })( +const PluginList = withStyles(styles, { name: "PluginList" })( ({ classes, settings, @@ -66,7 +66,6 @@ const PluginList = withStyles(styles, { name: "PageList" })( toggleAll, toolbar }: PluginListProps & WithStyles) => { - console.log(plugins); return ( diff --git a/src/plugins/index.tsx b/src/plugins/index.tsx index 651efd012..0cd192947 100644 --- a/src/plugins/index.tsx +++ b/src/plugins/index.tsx @@ -20,26 +20,26 @@ const PluginList: React.StatelessComponent> = ({ return ; }; -// const PageDetails: React.StatelessComponent> = ({ -// match -// }) => { -// const qs = parseQs(location.search.substr(1)); -// const params: PluginsListUrlQueryParams = qs; +const PageDetails: React.StatelessComponent> = ({ + match +}) => { + const qs = parseQs(location.search.substr(1)); + const params: PluginsListUrlQueryParams = qs; -// return ( -// -// ); -// }; + return ( + + ); +}; const Component = () => ( <> - {/* */} + ); diff --git a/src/plugins/mutations.ts b/src/plugins/mutations.ts index e69de29bb..e52658daa 100644 --- a/src/plugins/mutations.ts +++ b/src/plugins/mutations.ts @@ -0,0 +1,30 @@ +import gql from "graphql-tag"; + +import { TypedMutation } from "../mutations"; +import { pluginsDetailsFragment } from "./queries"; +import { + pluginConfigurationUpdate, + pluginConfigurationUpdateVariables +} from "./types/pluginConfigurationUpdate"; + +const pluginConfigurationUpdate = gql` + ${pluginsDetailsFragment} + mutation pluginConfigurationUpdate( + $id: ID! + $input: PluginConfigurationUpdateInput! + ) { + pluginConfigurationUpdate(id: $id, input: $input) { + errors { + field + message + } + pluginConfiguration { + ...pluginsDetailsFragment + } + } + } +`; +export const TypedPluginConfigurationUpdate = TypedMutation< + pluginConfigurationUpdate, + pluginConfigurationUpdateVariables +>(pluginConfigurationUpdate); diff --git a/src/plugins/queries.ts b/src/plugins/queries.ts index dfdf1cd69..f5d90461c 100644 --- a/src/plugins/queries.ts +++ b/src/plugins/queries.ts @@ -13,19 +13,19 @@ export const pluginsFragment = gql` } `; -// export const pluginsDetailsFragment = gql` -// ${pluginsFragment} -// fragment pluginsDetailsFragment on PluginConfiguration { -// ...pluginFragment -// configuration { -// name -// type -// value -// helpText -// label -// } -// } -// `; +export const pluginsDetailsFragment = gql` + ${pluginsFragment} + fragment pluginsDetailsFragment on PluginConfiguration { + ...pluginFragment + configuration { + name + type + value + helpText + label + } + } +`; const pluginsList = gql` ${pluginsFragment} @@ -54,15 +54,15 @@ export const TypedPluginsListQuery = TypedQuery< PluginsListVariables >(pluginsList); -// const pluginsDetails = gql` -// ${pluginsDetailsFragment} -// query pluginConfiguration($id: ID!) { -// page(id: $id) { -// ...pluginsDetailsFragment -// } -// } -// `; -// export const TypedPluginsDetailsQuery = TypedQuery< -// PluginDetails, -// PluginDetailsVariables -// >(pluginsDetails); +const pluginsDetails = gql` + ${pluginsDetailsFragment} + query pluginConfiguration($id: ID!) { + pluginConfiguration(id: $id) { + ...pluginsDetailsFragment + } + } +`; +export const TypedPluginsDetailsQuery = TypedQuery< + PluginDetails, + PluginDetailsVariables +>(pluginsDetails); diff --git a/src/plugins/views/PluginsDetails.tsx b/src/plugins/views/PluginsDetails.tsx new file mode 100644 index 000000000..12d00bf61 --- /dev/null +++ b/src/plugins/views/PluginsDetails.tsx @@ -0,0 +1,88 @@ +import DialogContentText from "@material-ui/core/DialogContentText"; +import React from "react"; + +import ActionDialog from "@saleor/components/ActionDialog"; +import { WindowTitle } from "@saleor/components/WindowTitle"; +import useNavigator from "@saleor/hooks/useNavigator"; +import useNotifier from "@saleor/hooks/useNotifier"; +import i18n from "../../i18n"; +import { getMutationState, maybe } from "../../misc"; +import { PluginConfigurationUpdateInput } from "../../types/globalTypes"; +import PluginsDetailsPage, { FormData } from "../components/PluginsDetailsPage"; +import { TypedPluginConfigurationUpdate } from "../mutations"; +import { TypedPluginsDetailsQuery } from "../queries"; +import { pluginsListUrl, pluginsUrl, PluginsUrlQueryParams } from "../urls"; + +export interface PluginsDetailsProps { + id: string; + params: PluginsUrlQueryParams; +} + +export const PluginsDetails: React.StatelessComponent = ({ + id, + params +}) => { + const navigate = useNavigator(); + const notify = useNotifier(); + + return ( + + {(pluginConfigurationUpdate, pluginConfigurationUpdateOpts) => ( + + {PluginDetails => { + const formTransitionState = getMutationState( + pluginConfigurationUpdateOpts.called, + pluginConfigurationUpdateOpts.loading, + maybe( + () => + pluginConfigurationUpdateOpts.data.pluginConfiguration.errors + ) + ); + + return ( + <> + PluginDetails.data.pluginConfiguration.name + )} + /> + + pluginConfigurationUpdateOpts.data.pluginConfiguration + .errors, + [] + )} + saveButtonBarState={formTransitionState} + plugin={maybe(() => PluginDetails.data.pluginConfiguration)} + onBack={() => navigate(pluginsListUrl())} + onSubmit={formData => { + const configurationInput = []; + formData.configuration.map(item => { + configurationInput.push({ + name: item.name, + value: item.value + }); + }); + pluginConfigurationUpdate({ + variables: { + id, + input: { + active: formData.active, + configuration: configurationInput + } + } + }); + }} + /> + + ); + }} + + )} + + ); +}; +PluginsDetails.displayName = "PluginsDetails"; +export default PluginsDetails; From 08b6eb6eb5d8f670dcc1b3667d047e7f259d0520 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Mon, 26 Aug 2019 19:08:43 +0200 Subject: [PATCH 03/24] Update types --- src/plugins/types/pluginConfiguration.ts | 35 ++++++++++++++ .../types/pluginConfigurationUpdate.ts | 48 +++++++++++++++++++ src/plugins/types/pluginsDetailsFragment.ts | 27 +++++++++++ src/types/globalTypes.ts | 15 ++++++ 4 files changed, 125 insertions(+) create mode 100644 src/plugins/types/pluginConfiguration.ts create mode 100644 src/plugins/types/pluginConfigurationUpdate.ts create mode 100644 src/plugins/types/pluginsDetailsFragment.ts diff --git a/src/plugins/types/pluginConfiguration.ts b/src/plugins/types/pluginConfiguration.ts new file mode 100644 index 000000000..2ca376f07 --- /dev/null +++ b/src/plugins/types/pluginConfiguration.ts @@ -0,0 +1,35 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +import { ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; + +// ==================================================== +// GraphQL query operation: pluginConfiguration +// ==================================================== + +export interface pluginConfiguration_pluginConfiguration_configuration { + __typename: "ConfigurationItem"; + name: string; + type: ConfigurationTypeFieldEnum | null; + value: string; + helpText: string | null; + label: string | null; +} + +export interface pluginConfiguration_pluginConfiguration { + __typename: "PluginConfiguration"; + id: string; + name: string; + description: string; + active: boolean; + configuration: (pluginConfiguration_pluginConfiguration_configuration | null)[] | null; +} + +export interface pluginConfiguration { + pluginConfiguration: pluginConfiguration_pluginConfiguration | null; +} + +export interface pluginConfigurationVariables { + id: string; +} diff --git a/src/plugins/types/pluginConfigurationUpdate.ts b/src/plugins/types/pluginConfigurationUpdate.ts new file mode 100644 index 000000000..0d3e0beec --- /dev/null +++ b/src/plugins/types/pluginConfigurationUpdate.ts @@ -0,0 +1,48 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +import { PluginConfigurationUpdateInput, ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; + +// ==================================================== +// GraphQL mutation operation: pluginConfigurationUpdate +// ==================================================== + +export interface pluginConfigurationUpdate_pluginConfigurationUpdate_errors { + __typename: "Error"; + field: string | null; + message: string | null; +} + +export interface pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration { + __typename: "ConfigurationItem"; + name: string; + type: ConfigurationTypeFieldEnum | null; + value: string; + helpText: string | null; + label: string | null; +} + +export interface pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration { + __typename: "PluginConfiguration"; + id: string; + name: string; + description: string; + active: boolean; + configuration: (pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration | null)[] | null; +} + +export interface pluginConfigurationUpdate_pluginConfigurationUpdate { + __typename: "PluginConfigurationUpdate"; + errors: pluginConfigurationUpdate_pluginConfigurationUpdate_errors[] | null; + pluginConfiguration: pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration | null; +} + +export interface pluginConfigurationUpdate { + pluginConfigurationUpdate: pluginConfigurationUpdate_pluginConfigurationUpdate | null; +} + +export interface pluginConfigurationUpdateVariables { + id: string; + input: PluginConfigurationUpdateInput; +} diff --git a/src/plugins/types/pluginsDetailsFragment.ts b/src/plugins/types/pluginsDetailsFragment.ts new file mode 100644 index 000000000..3a925ef75 --- /dev/null +++ b/src/plugins/types/pluginsDetailsFragment.ts @@ -0,0 +1,27 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +import { ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; + +// ==================================================== +// GraphQL fragment: pluginsDetailsFragment +// ==================================================== + +export interface pluginsDetailsFragment_configuration { + __typename: "ConfigurationItem"; + name: string; + type: ConfigurationTypeFieldEnum | null; + value: string; + helpText: string | null; + label: string | null; +} + +export interface pluginsDetailsFragment { + __typename: "PluginConfiguration"; + id: string; + name: string; + description: string; + active: boolean; + configuration: (pluginsDetailsFragment_configuration | null)[] | null; +} diff --git a/src/types/globalTypes.ts b/src/types/globalTypes.ts index ee1d14bb7..35cf5faaf 100644 --- a/src/types/globalTypes.ts +++ b/src/types/globalTypes.ts @@ -33,6 +33,11 @@ export enum AuthorizationKeyType { GOOGLE_OAUTH2 = "GOOGLE_OAUTH2", } +export enum ConfigurationTypeFieldEnum { + BOOLEAN = "BOOLEAN", + STRING = "STRING", +} + export enum DiscountValueTypeEnum { FIXED = "FIXED", PERCENTAGE = "PERCENTAGE", @@ -340,6 +345,11 @@ export interface CollectionInput { publicationDate?: any | null; } +export interface ConfigurationItemInput { + name: string; + value: string; +} + export interface CustomerInput { defaultBillingAddress?: AddressInput | null; defaultShippingAddress?: AddressInput | null; @@ -466,6 +476,11 @@ export interface PageTranslationInput { contentJson?: any | null; } +export interface PluginConfigurationUpdateInput { + active?: boolean | null; + configuration?: (ConfigurationItemInput | null)[] | null; +} + export interface PriceRangeInput { gte?: number | null; lte?: number | null; From 4d4f5b4b665b1cb8f232b66e2a33384260556a60 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Tue, 27 Aug 2019 14:36:19 +0200 Subject: [PATCH 04/24] Fix types --- src/components/TableHead/TableHead.tsx | 4 +- src/config.ts | 4 ++ .../components/PluginInfo/PluginInfo.tsx | 43 +++++--------- .../PluginSettings/PluginSettings.tsx | 37 +++++------- .../PluginsDetailsPage/PluginsDetailsPage.tsx | 57 +++++++------------ .../components/PluginsList/PluginsList.tsx | 26 ++++----- .../PluginsListPage/PluginsListPage.tsx | 16 +++--- src/plugins/index.tsx | 4 +- src/plugins/mutations.ts | 10 ++-- src/plugins/queries.ts | 28 ++++++--- src/plugins/types/pluginConfiguration.ts | 14 ++--- .../types/pluginConfigurationUpdate.ts | 22 +++---- src/plugins/types/pluginConfigurations.ts | 27 ++++++--- src/plugins/views/PluginsDetails.tsx | 24 +++----- src/plugins/views/PluginsList.tsx | 30 +++------- src/types.ts | 1 + 16 files changed, 153 insertions(+), 194 deletions(-) diff --git a/src/components/TableHead/TableHead.tsx b/src/components/TableHead/TableHead.tsx index 9305e263f..82a078e83 100644 --- a/src/components/TableHead/TableHead.tsx +++ b/src/components/TableHead/TableHead.tsx @@ -25,7 +25,7 @@ export interface TableHeadProps extends MuiTableHeadProps { dragRows?: boolean; selected: number; items: Node[]; - toolbar: React.ReactNode | React.ReactNodeArray; + toolbar?: React.ReactNode | React.ReactNodeArray; toggleAll: (items: Node[], selected: number) => void; } @@ -138,7 +138,7 @@ const TableHead = withStyles(styles, { )}
-
{toolbar}
+ {toolbar &&
{toolbar}
}
diff --git a/src/config.ts b/src/config.ts index ac5f694cd..7737bfe0d 100644 --- a/src/config.ts +++ b/src/config.ts @@ -21,6 +21,7 @@ export interface AppListViewSettings { [ListViews.NAVIGATION_LIST]: ListSettings; [ListViews.ORDER_LIST]: ListSettings; [ListViews.PAGES_LIST]: ListSettings; + [ListViews.PLUGINS_LIST]: ListSettings; [ListViews.PRODUCT_LIST]: ListSettings; [ListViews.SALES_LIST]: ListSettings; [ListViews.SHIPPING_METHODS_LIST]: ListSettings; @@ -49,6 +50,9 @@ export const defaultListSettings: AppListViewSettings = { [ListViews.PAGES_LIST]: { rowNumber: PAGINATE_BY }, + [ListViews.PLUGINS_LIST]: { + rowNumber: PAGINATE_BY + }, [ListViews.PRODUCT_LIST]: { columns: ["isPublished", "price", "productType"], rowNumber: PAGINATE_BY diff --git a/src/plugins/components/PluginInfo/PluginInfo.tsx b/src/plugins/components/PluginInfo/PluginInfo.tsx index b3b288c2f..1b45455c8 100644 --- a/src/plugins/components/PluginInfo/PluginInfo.tsx +++ b/src/plugins/components/PluginInfo/PluginInfo.tsx @@ -1,12 +1,6 @@ import Card from "@material-ui/core/Card"; import CardContent from "@material-ui/core/CardContent"; -import { - createStyles, - Theme, - withStyles, - WithStyles -} from "@material-ui/core/styles"; -import TextField from "@material-ui/core/TextField"; +import { createStyles, withStyles, WithStyles } from "@material-ui/core/styles"; import Typography from "@material-ui/core/Typography"; import React from "react"; @@ -19,36 +13,27 @@ import { FormData } from "../PluginsDetailsPage"; interface PluginInfoProps { data: FormData; - errors: Partial<{ - description: string; - domain: string; - name: string; - }>; - disabled: boolean; onChange: (event: React.ChangeEvent) => void; } -const styles = (theme: Theme) => - createStyles({ - title: { - fontSize: 14, - color: "#616161", - paddingTop: 10 - }, - status: { - fontSize: 16, - color: "#3D3D3D", - paddingTop: 20, - fontWeight: "400" - } - }); +const styles = createStyles({ + status: { + color: "#3D3D3D", + fontSize: 16, + fontWeight: 400, + paddingTop: 20 + }, + title: { + color: "#616161", + fontSize: 14, + paddingTop: 10 + } +}); const PluginInfo = withStyles(styles, { name: "PluginInfo" })( ({ data, - disabled, classes, - errors, onChange }: PluginInfoProps & WithStyles) => { return ( diff --git a/src/plugins/components/PluginSettings/PluginSettings.tsx b/src/plugins/components/PluginSettings/PluginSettings.tsx index 2927f9ed4..468e57221 100644 --- a/src/plugins/components/PluginSettings/PluginSettings.tsx +++ b/src/plugins/components/PluginSettings/PluginSettings.tsx @@ -1,18 +1,10 @@ import Card from "@material-ui/core/Card"; import CardContent from "@material-ui/core/CardContent"; -import ControlledSwitch from "@saleor/components/ControlledSwitch"; -import { - createStyles, - Theme, - withStyles, - WithStyles -} from "@material-ui/core/styles"; +import { createStyles, withStyles, WithStyles } from "@material-ui/core/styles"; import TextField from "@material-ui/core/TextField"; -import Typography from "@material-ui/core/Typography"; -import React from "react"; - import CardTitle from "@saleor/components/CardTitle"; -import FormSpacer from "@saleor/components/FormSpacer"; +import ControlledSwitch from "@saleor/components/ControlledSwitch"; +import React from "react"; import i18n from "../../../i18n"; import { FormData } from "../PluginsDetailsPage"; @@ -27,13 +19,12 @@ interface PluginSettingsProps { onChange: (event: React.ChangeEvent) => void; } -const styles = (theme: Theme) => - createStyles({ - item: { - marginBottom: 5, - marginTop: 10 - } - }); +const styles = createStyles({ + item: { + paddingBottom: 5, + paddingTop: 5 + } +}); const PluginSettings = withStyles(styles, { name: "PluginSettings" })( ({ @@ -42,7 +33,8 @@ const PluginSettings = withStyles(styles, { name: "PluginSettings" })( classes, errors, onChange - }: PluginSettingsProps & WithStyles) => ( + }: PluginSettingsProps & WithStyles) => { + return ( {data.configuration.map((configuration, index) => ( -
+
{configuration.type === "STRING" && ( ); + } ); PluginSettings.displayName = "PluginSettings"; export default PluginSettings; diff --git a/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx b/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx index f68947787..e1808b310 100644 --- a/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx +++ b/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx @@ -1,42 +1,36 @@ -import React from "react"; import Typography from "@material-ui/core/Typography"; import AppHeader from "@saleor/components/AppHeader"; -import CardSpacer from "@saleor/components/CardSpacer"; import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton"; import Container from "@saleor/components/Container"; import Form from "@saleor/components/Form"; import Grid from "@saleor/components/Grid"; import PageHeader from "@saleor/components/PageHeader"; import SaveButtonBar from "@saleor/components/SaveButtonBar"; -import SeoForm from "@saleor/components/SeoForm"; -import VisibilityCard from "@saleor/components/VisibilityCard"; +import { maybe } from "@saleor/misc"; +import { UserError } from "@saleor/types"; +import React from "react"; + import i18n from "../../../i18n"; -import { maybe } from "../../../misc"; -import { UserError } from "../../../types"; -import { PageDetails_page } from "../../types/PluginDetails"; import PluginInfo from "../PluginInfo"; import PluginSettings from "../PluginSettings"; export interface FormData { - name: string; - description: string; + name?: string; + description?: string; active: boolean; - id: string; - configuration: [ - { - name: string; - value: string; - type: string; - helpText: string; - label: string; - } - ]; + configuration: Array<{ + name: string; + value: string; + type: string; + helpText: string; + label: string; + }>; } export interface PageDetailsPageProps { disabled: boolean; errors: UserError[]; - plugin: PageDetails_page; + plugin: FormData; saveButtonBarState: ConfirmButtonTransitionState; onBack: () => void; onSubmit: (data: FormData) => void; @@ -51,22 +45,14 @@ const PageDetailsPage: React.StatelessComponent = ({ onSubmit }) => { const initialForm: FormData = { - name: maybe(() => plugin.name, ""), - description: maybe(() => plugin.description, ""), active: maybe(() => plugin.active, false), - configuration: maybe(() => plugin.configuration, []) + configuration: maybe(() => plugin.configuration, []), + description: maybe(() => plugin.description, ""), + name: maybe(() => plugin.name, "") }; return (
- {({ - change, - data, - errors: formErrors, - hasChanged, - submit, - set, - triggerChange - }) => { + {({ data, errors, hasChanged, submit, set, triggerChange }) => { const newData = { active: data.active, configuration: data.configuration @@ -104,12 +90,7 @@ const PageDetailsPage: React.StatelessComponent = ({ )}
- + {data.configuration && ( <>
diff --git a/src/plugins/components/PluginsList/PluginsList.tsx b/src/plugins/components/PluginsList/PluginsList.tsx index 0086d3559..d6a575a43 100644 --- a/src/plugins/components/PluginsList/PluginsList.tsx +++ b/src/plugins/components/PluginsList/PluginsList.tsx @@ -20,28 +20,28 @@ import TableHead from "@saleor/components/TableHead"; import TablePagination from "@saleor/components/TablePagination"; import i18n from "@saleor/i18n"; import { maybe, renderCollection } from "@saleor/misc"; -import { ListActions, ListProps } from "@saleor/types"; -import { PageList_pages_edges_node } from "../../types/PageList"; +import { ListActionsWithoutToolbar, ListProps } from "@saleor/types"; +import { PluginConfigurations_pluginConfigurations_edges_node } from "../../types/pluginConfigurations"; -export interface PluginListProps extends ListProps, ListActions { - plugins: PageList_pages_edges_node[]; +export interface PluginListProps extends ListProps, ListActionsWithoutToolbar { + plugins: PluginConfigurations_pluginConfigurations_edges_node[]; } const styles = (theme: Theme) => createStyles({ [theme.breakpoints.up("lg")]: { - colActive: {}, - colName: {}, colAction: { - textAlign: "right", "& svg": { color: theme.palette.primary.main - } - } + }, + textAlign: "right" + }, + colActive: {}, + colName: {} }, - colName: {}, - colActive: {}, colAction: {}, + colActive: {}, + colName: {}, link: { cursor: "pointer" } @@ -63,8 +63,7 @@ const PluginList = withStyles(styles, { name: "PluginList" })( isChecked, selected, toggle, - toggleAll, - toolbar + toggleAll }: PluginListProps & WithStyles) => { return ( @@ -75,7 +74,6 @@ const PluginList = withStyles(styles, { name: "PluginList" })( disabled={disabled} items={plugins} toggleAll={toggleAll} - toolbar={toolbar} > {i18n.t("Name", { context: "table header" })} diff --git a/src/plugins/components/PluginsListPage/PluginsListPage.tsx b/src/plugins/components/PluginsListPage/PluginsListPage.tsx index 5375117ae..81d0553f5 100644 --- a/src/plugins/components/PluginsListPage/PluginsListPage.tsx +++ b/src/plugins/components/PluginsListPage/PluginsListPage.tsx @@ -1,17 +1,17 @@ -import Button from "@material-ui/core/Button"; -import AddIcon from "@material-ui/icons/Add"; import React from "react"; import AppHeader from "@saleor/components/AppHeader"; import Container from "@saleor/components/Container"; import PageHeader from "@saleor/components/PageHeader"; import i18n from "@saleor/i18n"; -import { ListActions, PageListProps } from "@saleor/types"; -import { PageList_pages_edges_node } from "../../types/PageList"; +import { ListActionsWithoutToolbar, PageListProps } from "@saleor/types"; +import { PluginConfigurations_pluginConfigurations_edges_node } from "../../types/PluginConfigurations"; import PluginsList from "../PluginsList/PluginsList"; -export interface PluginsListPageProps extends PageListProps, ListActions { - pages: PageList_pages_edges_node[]; +export interface PluginsListPageProps + extends PageListProps, + ListActionsWithoutToolbar { + plugins: PluginConfigurations_pluginConfigurations_edges_node[]; onBack: () => void; } @@ -28,8 +28,7 @@ const PluginsListPage: React.StatelessComponent = ({ isChecked, selected, toggle, - toggleAll, - toolbar + toggleAll }) => ( {i18n.t("Configuration")} @@ -47,7 +46,6 @@ const PluginsListPage: React.StatelessComponent = ({ selected={selected} toggle={toggle} toggleAll={toggleAll} - toolbar={toolbar} /> ); diff --git a/src/plugins/index.tsx b/src/plugins/index.tsx index 0cd192947..a518872e6 100644 --- a/src/plugins/index.tsx +++ b/src/plugins/index.tsx @@ -5,9 +5,9 @@ import { Route, RouteComponentProps, Switch } from "react-router-dom"; import { WindowTitle } from "../components/WindowTitle"; import i18n from "../i18n"; import { - pluginsPath, pluginsListPath, - PluginsListUrlQueryParams + PluginsListUrlQueryParams, + pluginsPath } from "./urls"; import PluginsDetailsComponent from "./views/PluginsDetails"; import PluginsListComponent from "./views/PluginsList"; diff --git a/src/plugins/mutations.ts b/src/plugins/mutations.ts index e52658daa..a5f1834a9 100644 --- a/src/plugins/mutations.ts +++ b/src/plugins/mutations.ts @@ -3,13 +3,13 @@ import gql from "graphql-tag"; import { TypedMutation } from "../mutations"; import { pluginsDetailsFragment } from "./queries"; import { - pluginConfigurationUpdate, - pluginConfigurationUpdateVariables + PluginConfigurationUpdate, + PluginConfigurationUpdateVariables } from "./types/pluginConfigurationUpdate"; const pluginConfigurationUpdate = gql` ${pluginsDetailsFragment} - mutation pluginConfigurationUpdate( + mutation PluginConfigurationUpdate( $id: ID! $input: PluginConfigurationUpdateInput! ) { @@ -25,6 +25,6 @@ const pluginConfigurationUpdate = gql` } `; export const TypedPluginConfigurationUpdate = TypedMutation< - pluginConfigurationUpdate, - pluginConfigurationUpdateVariables + PluginConfigurationUpdate, + PluginConfigurationUpdateVariables >(pluginConfigurationUpdate); diff --git a/src/plugins/queries.ts b/src/plugins/queries.ts index f5d90461c..518895048 100644 --- a/src/plugins/queries.ts +++ b/src/plugins/queries.ts @@ -1,8 +1,14 @@ import gql from "graphql-tag"; import { TypedQuery } from "../queries"; -import { PluginDetails, PluginDetailsVariables } from "./types/PluginDetails"; -import { PluginsList, PluginsListVariables } from "./types/PluginsList"; +import { + PluginConfiguration, + PluginConfigurationVariables +} from "./types/pluginConfiguration"; +import { + PluginConfigurations, + PluginConfigurationsVariables +} from "./types/pluginConfigurations"; export const pluginsFragment = gql` fragment pluginFragment on PluginConfiguration { @@ -29,7 +35,7 @@ export const pluginsDetailsFragment = gql` const pluginsList = gql` ${pluginsFragment} - query pluginConfigurations( + query PluginConfigurations( $first: Int $after: String $last: Int @@ -46,23 +52,29 @@ const pluginsList = gql` ...pluginFragment } } + pageInfo { + hasPreviousPage + hasNextPage + startCursor + endCursor + } } } `; export const TypedPluginsListQuery = TypedQuery< - PluginsList, - PluginsListVariables + PluginConfigurations, + PluginConfigurationsVariables >(pluginsList); const pluginsDetails = gql` ${pluginsDetailsFragment} - query pluginConfiguration($id: ID!) { + query PluginConfiguration($id: ID!) { pluginConfiguration(id: $id) { ...pluginsDetailsFragment } } `; export const TypedPluginsDetailsQuery = TypedQuery< - PluginDetails, - PluginDetailsVariables + PluginConfiguration, + PluginConfigurationVariables >(pluginsDetails); diff --git a/src/plugins/types/pluginConfiguration.ts b/src/plugins/types/pluginConfiguration.ts index 2ca376f07..9a339ce17 100644 --- a/src/plugins/types/pluginConfiguration.ts +++ b/src/plugins/types/pluginConfiguration.ts @@ -5,10 +5,10 @@ import { ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; // ==================================================== -// GraphQL query operation: pluginConfiguration +// GraphQL query operation: PluginConfiguration // ==================================================== -export interface pluginConfiguration_pluginConfiguration_configuration { +export interface PluginConfiguration_pluginConfiguration_configuration { __typename: "ConfigurationItem"; name: string; type: ConfigurationTypeFieldEnum | null; @@ -17,19 +17,19 @@ export interface pluginConfiguration_pluginConfiguration_configuration { label: string | null; } -export interface pluginConfiguration_pluginConfiguration { +export interface PluginConfiguration_pluginConfiguration { __typename: "PluginConfiguration"; id: string; name: string; description: string; active: boolean; - configuration: (pluginConfiguration_pluginConfiguration_configuration | null)[] | null; + configuration: (PluginConfiguration_pluginConfiguration_configuration | null)[] | null; } -export interface pluginConfiguration { - pluginConfiguration: pluginConfiguration_pluginConfiguration | null; +export interface PluginConfiguration { + pluginConfiguration: PluginConfiguration_pluginConfiguration | null; } -export interface pluginConfigurationVariables { +export interface PluginConfigurationVariables { id: string; } diff --git a/src/plugins/types/pluginConfigurationUpdate.ts b/src/plugins/types/pluginConfigurationUpdate.ts index 0d3e0beec..fbd7db2a9 100644 --- a/src/plugins/types/pluginConfigurationUpdate.ts +++ b/src/plugins/types/pluginConfigurationUpdate.ts @@ -5,16 +5,16 @@ import { PluginConfigurationUpdateInput, ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; // ==================================================== -// GraphQL mutation operation: pluginConfigurationUpdate +// GraphQL mutation operation: PluginConfigurationUpdate // ==================================================== -export interface pluginConfigurationUpdate_pluginConfigurationUpdate_errors { +export interface PluginConfigurationUpdate_pluginConfigurationUpdate_errors { __typename: "Error"; field: string | null; message: string | null; } -export interface pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration { +export interface PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration { __typename: "ConfigurationItem"; name: string; type: ConfigurationTypeFieldEnum | null; @@ -23,26 +23,26 @@ export interface pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfi label: string | null; } -export interface pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration { +export interface PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration { __typename: "PluginConfiguration"; id: string; name: string; description: string; active: boolean; - configuration: (pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration | null)[] | null; + configuration: (PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration | null)[] | null; } -export interface pluginConfigurationUpdate_pluginConfigurationUpdate { +export interface PluginConfigurationUpdate_pluginConfigurationUpdate { __typename: "PluginConfigurationUpdate"; - errors: pluginConfigurationUpdate_pluginConfigurationUpdate_errors[] | null; - pluginConfiguration: pluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration | null; + errors: PluginConfigurationUpdate_pluginConfigurationUpdate_errors[] | null; + pluginConfiguration: PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration | null; } -export interface pluginConfigurationUpdate { - pluginConfigurationUpdate: pluginConfigurationUpdate_pluginConfigurationUpdate | null; +export interface PluginConfigurationUpdate { + pluginConfigurationUpdate: PluginConfigurationUpdate_pluginConfigurationUpdate | null; } -export interface pluginConfigurationUpdateVariables { +export interface PluginConfigurationUpdateVariables { id: string; input: PluginConfigurationUpdateInput; } diff --git a/src/plugins/types/pluginConfigurations.ts b/src/plugins/types/pluginConfigurations.ts index 3204a58d7..cf8b48ce9 100644 --- a/src/plugins/types/pluginConfigurations.ts +++ b/src/plugins/types/pluginConfigurations.ts @@ -3,10 +3,10 @@ // This file was automatically generated and should not be edited. // ==================================================== -// GraphQL query operation: pluginConfigurations +// GraphQL query operation: PluginConfigurations // ==================================================== -export interface pluginConfigurations_pluginConfigurations_edges_node { +export interface PluginConfigurations_pluginConfigurations_edges_node { __typename: "PluginConfiguration"; id: string; name: string; @@ -14,21 +14,30 @@ export interface pluginConfigurations_pluginConfigurations_edges_node { active: boolean; } -export interface pluginConfigurations_pluginConfigurations_edges { +export interface PluginConfigurations_pluginConfigurations_edges { __typename: "PluginConfigurationCountableEdge"; - node: pluginConfigurations_pluginConfigurations_edges_node; + node: PluginConfigurations_pluginConfigurations_edges_node; } -export interface pluginConfigurations_pluginConfigurations { +export interface PluginConfigurations_pluginConfigurations_pageInfo { + __typename: "PageInfo"; + hasPreviousPage: boolean; + hasNextPage: boolean; + startCursor: string | null; + endCursor: string | null; +} + +export interface PluginConfigurations_pluginConfigurations { __typename: "PluginConfigurationCountableConnection"; - edges: pluginConfigurations_pluginConfigurations_edges[]; + edges: PluginConfigurations_pluginConfigurations_edges[]; + pageInfo: PluginConfigurations_pluginConfigurations_pageInfo; } -export interface pluginConfigurations { - pluginConfigurations: pluginConfigurations_pluginConfigurations | null; +export interface PluginConfigurations { + pluginConfigurations: PluginConfigurations_pluginConfigurations | null; } -export interface pluginConfigurationsVariables { +export interface PluginConfigurationsVariables { first?: number | null; after?: string | null; last?: number | null; diff --git a/src/plugins/views/PluginsDetails.tsx b/src/plugins/views/PluginsDetails.tsx index 12d00bf61..840ba1f16 100644 --- a/src/plugins/views/PluginsDetails.tsx +++ b/src/plugins/views/PluginsDetails.tsx @@ -1,29 +1,22 @@ -import DialogContentText from "@material-ui/core/DialogContentText"; import React from "react"; -import ActionDialog from "@saleor/components/ActionDialog"; import { WindowTitle } from "@saleor/components/WindowTitle"; import useNavigator from "@saleor/hooks/useNavigator"; -import useNotifier from "@saleor/hooks/useNotifier"; -import i18n from "../../i18n"; import { getMutationState, maybe } from "../../misc"; -import { PluginConfigurationUpdateInput } from "../../types/globalTypes"; -import PluginsDetailsPage, { FormData } from "../components/PluginsDetailsPage"; +import PluginsDetailsPage from "../components/PluginsDetailsPage"; import { TypedPluginConfigurationUpdate } from "../mutations"; import { TypedPluginsDetailsQuery } from "../queries"; -import { pluginsListUrl, pluginsUrl, PluginsUrlQueryParams } from "../urls"; +import { pluginsListUrl, PluginsListUrlQueryParams } from "../urls"; export interface PluginsDetailsProps { id: string; - params: PluginsUrlQueryParams; + params: PluginsListUrlQueryParams; } export const PluginsDetails: React.StatelessComponent = ({ - id, - params + id }) => { const navigate = useNavigator(); - const notify = useNotifier(); return ( @@ -35,7 +28,8 @@ export const PluginsDetails: React.StatelessComponent = ({ pluginConfigurationUpdateOpts.loading, maybe( () => - pluginConfigurationUpdateOpts.data.pluginConfiguration.errors + pluginConfigurationUpdateOpts.data.pluginConfigurationUpdate + .errors ) ); @@ -50,8 +44,8 @@ export const PluginsDetails: React.StatelessComponent = ({ disabled={PluginDetails.loading} errors={maybe( () => - pluginConfigurationUpdateOpts.data.pluginConfiguration - .errors, + pluginConfigurationUpdateOpts.data + .pluginConfigurationUpdate.errors, [] )} saveButtonBarState={formTransitionState} @@ -62,7 +56,7 @@ export const PluginsDetails: React.StatelessComponent = ({ formData.configuration.map(item => { configurationInput.push({ name: item.name, - value: item.value + value: item.value.toString() }); }); pluginConfigurationUpdate({ diff --git a/src/plugins/views/PluginsList.tsx b/src/plugins/views/PluginsList.tsx index ef954a175..58d2ea0c4 100644 --- a/src/plugins/views/PluginsList.tsx +++ b/src/plugins/views/PluginsList.tsx @@ -1,29 +1,16 @@ -import Button from "@material-ui/core/Button"; -import DialogContentText from "@material-ui/core/DialogContentText"; -import IconButton from "@material-ui/core/IconButton"; -import DeleteIcon from "@material-ui/icons/Delete"; -import React from "react"; - -import ActionDialog from "@saleor/components/ActionDialog"; import { configurationMenuUrl } from "@saleor/configuration"; import useBulkActions from "@saleor/hooks/useBulkActions"; import useListSettings from "@saleor/hooks/useListSettings"; import useNavigator from "@saleor/hooks/useNavigator"; -import useNotifier from "@saleor/hooks/useNotifier"; import usePaginator, { createPaginationState } from "@saleor/hooks/usePaginator"; -import i18n from "@saleor/i18n"; -import { getMutationState, maybe } from "@saleor/misc"; +import { maybe } from "@saleor/misc"; import { ListViews } from "@saleor/types"; +import React from "react"; import PluginsListPage from "../components/PluginsListPage/PluginsListPage"; import { TypedPluginsListQuery } from "../queries"; -import { - pluginsListUrl, - PluginsListUrlDialog, - PluginsListUrlQueryParams, - pluginsUrl -} from "../urls"; +import { PluginsListUrlQueryParams, pluginsUrl } from "../urls"; interface PluginsListProps { params: PluginsListUrlQueryParams; @@ -33,25 +20,23 @@ export const PluginsList: React.StatelessComponent = ({ params }) => { const navigate = useNavigator(); - const notify = useNotifier(); const paginate = usePaginator(); - const { isSelected, listElements, reset, toggle, toggleAll } = useBulkActions( + const { isSelected, listElements, toggle, toggleAll } = useBulkActions( params.ids ); const { updateListSettings, settings } = useListSettings( - ListViews.PAGES_LIST + ListViews.PLUGINS_LIST ); const paginationState = createPaginationState(settings.rowNumber, params); return ( - {({ data, loading, refetch }) => { + {({ data, loading }) => { const { loadNextPage, loadPreviousPage, pageInfo } = paginate( - maybe(() => data.pages.pageInfo), + maybe(() => data.pluginConfigurations.pageInfo), paginationState, params ); - return ( <> = ({ data.pluginConfigurations.edges.map(edge => edge.node) )} pageInfo={pageInfo} + onAdd={() => navigate(configurationMenuUrl)} onBack={() => navigate(configurationMenuUrl)} onNextPage={loadNextPage} onPreviousPage={loadPreviousPage} diff --git a/src/types.ts b/src/types.ts index dad6b8952..8a6b01353 100644 --- a/src/types.ts +++ b/src/types.ts @@ -23,6 +23,7 @@ export enum ListViews { NAVIGATION_LIST = "NAVIGATION_LIST", ORDER_LIST = "ORDER_LIST", PAGES_LIST = "PAGES_LIST", + PLUGINS_LIST = "PLUGIN_LIST", PRODUCT_LIST = "PRODUCT_LIST", SALES_LIST = "SALES_LIST", SHIPPING_METHODS_LIST = "SHIPPING_METHODS_LIST", From 1f3bcf1a3c24a6fd54af761a83fa2429e6e723af Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 10:29:06 +0200 Subject: [PATCH 05/24] Fix switch onChange --- .../components/PluginSettings/PluginSettings.tsx | 10 +++++++--- .../PluginsDetailsPage/PluginsDetailsPage.tsx | 2 +- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/src/plugins/components/PluginSettings/PluginSettings.tsx b/src/plugins/components/PluginSettings/PluginSettings.tsx index 468e57221..fc2cb9c81 100644 --- a/src/plugins/components/PluginSettings/PluginSettings.tsx +++ b/src/plugins/components/PluginSettings/PluginSettings.tsx @@ -21,8 +21,8 @@ interface PluginSettingsProps { const styles = createStyles({ item: { - paddingBottom: 5, - paddingTop: 5 + paddingBottom: 10, + paddingTop: 10 } }); @@ -57,7 +57,11 @@ const PluginSettings = withStyles(styles, { name: "PluginSettings" })( )} {configuration.type === "BOOLEAN" && ( = ({ description: maybe(() => plugin.description, ""), name: maybe(() => plugin.name, "") }; + return ( {({ data, errors, hasChanged, submit, set, triggerChange }) => { @@ -63,7 +64,6 @@ const PageDetailsPage: React.StatelessComponent = ({ name === "active" ? (newData.active = value) : (newData.active = data.active); - newData.configuration.map(item => { if (item.name === name) { item.value = value; From 89ed6393288585c526fd5fc5a9be0f956f0df449 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 15:02:45 +0200 Subject: [PATCH 06/24] Add storybook --- .../PluginsDetailsPage/PluginsDetailsPage.tsx | 8 +-- src/plugins/fixtures.ts | 56 +++++++++++++++++++ src/storybook/config.js | 4 ++ .../stories/plugins/PluginDetailsPage.tsx | 36 ++++++++++++ .../stories/plugins/PluginsListPage.tsx | 27 +++++++++ 5 files changed, 127 insertions(+), 4 deletions(-) create mode 100644 src/plugins/fixtures.ts create mode 100644 src/storybook/stories/plugins/PluginDetailsPage.tsx create mode 100644 src/storybook/stories/plugins/PluginsListPage.tsx diff --git a/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx b/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx index 7867faca5..71512d8da 100644 --- a/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx +++ b/src/plugins/components/PluginsDetailsPage/PluginsDetailsPage.tsx @@ -27,7 +27,7 @@ export interface FormData { }>; } -export interface PageDetailsPageProps { +export interface PluginsDetailsPageProps { disabled: boolean; errors: UserError[]; plugin: FormData; @@ -36,7 +36,7 @@ export interface PageDetailsPageProps { onSubmit: (data: FormData) => void; } -const PageDetailsPage: React.StatelessComponent = ({ +const PluginsDetailsPage: React.StatelessComponent = ({ disabled, errors, plugin, @@ -124,5 +124,5 @@ const PageDetailsPage: React.StatelessComponent = ({ ); }; -PageDetailsPage.displayName = "PageDetailsPage"; -export default PageDetailsPage; +PluginsDetailsPage.displayName = "PluginsDetailsPage"; +export default PluginsDetailsPage; diff --git a/src/plugins/fixtures.ts b/src/plugins/fixtures.ts new file mode 100644 index 000000000..b58634c4e --- /dev/null +++ b/src/plugins/fixtures.ts @@ -0,0 +1,56 @@ +import { PluginConfiguration_pluginConfiguration } from "./types/pluginConfiguration"; +import { PluginConfigurations_pluginConfigurations_edges_node } from "./types/pluginConfigurations"; +import { ConfigurationTypeFieldEnum } from "@saleor/types/globalTypes"; + +export const pluginList: PluginConfigurations_pluginConfigurations_edges_node[] = [ + { + __typename: "PluginConfiguration", + id: "Jzx123sEt==", + name: "Avalara", + description: + "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", + active: true + }, + { + __typename: "PluginConfiguration", + id: "Jzx123sEt==", + name: "VatLayer", + description: + "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", + active: false + } +]; +export const plugin: PluginConfiguration_pluginConfiguration = { + __typename: "PluginConfiguration", + id: "UGx1Z2luQ29uZmlndXJhdGlvbjoy", + name: "Username or account", + description: + "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", + active: true, + configuration: [ + { + __typename: "ConfigurationItem", + name: "Username or account", + value: "", + type: ConfigurationTypeFieldEnum.STRING, + helpText: "Provide user or account details", + label: "Username or account" + }, + { + __typename: "ConfigurationItem", + name: "Password or license", + value: "", + type: ConfigurationTypeFieldEnum.STRING, + helpText: "Provide password or license details", + label: "Password or license" + }, + { + __typename: "ConfigurationItem", + name: "Use sandbox", + value: "true", + type: ConfigurationTypeFieldEnum.BOOLEAN, + helpText: "Determines if Saleor should use Avatax sandbox API.", + label: "Use sandbox" + } + ] +}; diff --git a/src/storybook/config.js b/src/storybook/config.js index 48c108661..78aff494a 100644 --- a/src/storybook/config.js +++ b/src/storybook/config.js @@ -101,6 +101,10 @@ function loadStories() { require("./stories/pages/PageDetailsPage"); require("./stories/pages/PageListPage"); + // Plugins + require("./stories/plugins/PluginDetailsPage"); + require("./stories/plugins/PluginsListPage"); + // Products require("./stories/products/ProductCreatePage"); require("./stories/products/ProductImagePage"); diff --git a/src/storybook/stories/plugins/PluginDetailsPage.tsx b/src/storybook/stories/plugins/PluginDetailsPage.tsx new file mode 100644 index 000000000..55e9fae65 --- /dev/null +++ b/src/storybook/stories/plugins/PluginDetailsPage.tsx @@ -0,0 +1,36 @@ +import { storiesOf } from "@storybook/react"; +import React from "react"; + +import PluginsDetailsPage, { + FormData, + PluginsDetailsPageProps +} from "../../../plugins/components/PluginsDetailsPage"; +import { plugin } from "../../../plugins/fixtures"; +import Decorator from "../../Decorator"; +import { formError } from "../../misc"; + +const props: PluginsDetailsPageProps = { + disabled: false, + errors: [], + onSubmit: () => undefined, + onBack: () => undefined, + plugin, + saveButtonBarState: "default" +}; + +storiesOf("Views / Plugins / Plugin details", module) + .addDecorator(Decorator) + .add("default", () => ) + .add("loading", () => ( + + )) + .add("form errors", () => ( + ).map(formError)} + /> + )); diff --git a/src/storybook/stories/plugins/PluginsListPage.tsx b/src/storybook/stories/plugins/PluginsListPage.tsx new file mode 100644 index 000000000..b94c445b4 --- /dev/null +++ b/src/storybook/stories/plugins/PluginsListPage.tsx @@ -0,0 +1,27 @@ +import { storiesOf } from "@storybook/react"; +import React from "react"; + +import { pageListProps } from "../../../fixtures"; +import PluginsListPage, { + PluginsListPageProps +} from "../../../plugins/components/PluginsListPage"; +import { pluginList } from "../../../plugins/fixtures"; +import Decorator from "../../Decorator"; + +const props: PluginsListPageProps = { + ...pageListProps.default, + toggle: () => undefined, + toggleAll: () => undefined, + isChecked: () => undefined, + selected: undefined, + onBack: () => undefined, + plugins: pluginList +}; + +storiesOf("Views / Plugins / Plugin list", module) + .addDecorator(Decorator) + .add("default", () => ) + .add("loading", () => ( + + )) + .add("no data", () => ); From c4161f891ac3f6b73c3a1267efc4b22c3e3a9d34 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 15:08:48 +0200 Subject: [PATCH 07/24] Use ConfigurationTypeFieldEnum --- src/plugins/components/PluginSettings/PluginSettings.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/plugins/components/PluginSettings/PluginSettings.tsx b/src/plugins/components/PluginSettings/PluginSettings.tsx index fc2cb9c81..0f7459276 100644 --- a/src/plugins/components/PluginSettings/PluginSettings.tsx +++ b/src/plugins/components/PluginSettings/PluginSettings.tsx @@ -4,6 +4,7 @@ import { createStyles, withStyles, WithStyles } from "@material-ui/core/styles"; import TextField from "@material-ui/core/TextField"; import CardTitle from "@saleor/components/CardTitle"; import ControlledSwitch from "@saleor/components/ControlledSwitch"; +import { ConfigurationTypeFieldEnum } from "@saleor/types/globalTypes"; import React from "react"; import i18n from "../../../i18n"; import { FormData } from "../PluginsDetailsPage"; @@ -44,7 +45,7 @@ const PluginSettings = withStyles(styles, { name: "PluginSettings" })( {data.configuration.map((configuration, index) => (
- {configuration.type === "STRING" && ( + {configuration.type === ConfigurationTypeFieldEnum.STRING && ( )} - {configuration.type === "BOOLEAN" && ( + {configuration.type === ConfigurationTypeFieldEnum.BOOLEAN && ( Date: Wed, 28 Aug 2019 15:11:01 +0200 Subject: [PATCH 08/24] Add helperText to configuration --- src/plugins/components/PluginSettings/PluginSettings.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/plugins/components/PluginSettings/PluginSettings.tsx b/src/plugins/components/PluginSettings/PluginSettings.tsx index 0f7459276..2450d1429 100644 --- a/src/plugins/components/PluginSettings/PluginSettings.tsx +++ b/src/plugins/components/PluginSettings/PluginSettings.tsx @@ -49,6 +49,7 @@ const PluginSettings = withStyles(styles, { name: "PluginSettings" })( From 02eec109dc076a1bfff4e30ce33ded9775c833f4 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 15:13:03 +0200 Subject: [PATCH 09/24] Fix helperText --- src/plugins/components/PluginSettings/PluginSettings.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/plugins/components/PluginSettings/PluginSettings.tsx b/src/plugins/components/PluginSettings/PluginSettings.tsx index 2450d1429..c2e5f52db 100644 --- a/src/plugins/components/PluginSettings/PluginSettings.tsx +++ b/src/plugins/components/PluginSettings/PluginSettings.tsx @@ -65,7 +65,6 @@ const PluginSettings = withStyles(styles, { name: "PluginSettings" })( : configuration.value } label={configuration.label} - helperText={configuration.helpText} name={configuration.name} onChange={onChange} /> From be8f6ab3b1cad52a521ee126afbf3385ce4a110c Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 15:14:42 +0200 Subject: [PATCH 10/24] Update snapshots --- .../__snapshots__/Stories.test.ts.snap | 1553 +++++++++++++++++ 1 file changed, 1553 insertions(+) diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap index a34423093..6b7ce8319 100644 --- a/src/storybook/__snapshots__/Stories.test.ts.snap +++ b/src/storybook/__snapshots__/Stories.test.ts.snap @@ -74206,6 +74206,1559 @@ exports[`Storyshots Views / Pages / Page list no data 1`] = `
`; +exports[`Storyshots Views / Plugins / Plugin details default 1`] = ` +
+
+
+
+
+ Username or account Details +
+
+
+
+
+
+
+
+ Plugin Information and Status +
+

+ These are general information about your store. They define what is the URL of your store and what is shown in brow sers taskbar. +

+
+
+
+ + Plugin Information and Status + +
+
+
+
+
+
+ Plugin Name +
+

+ Username or account +

+
+ Plugin Description +
+

+ Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna. +

+
+
+
+ Status +
+
+
+
+ Plugin Settings +
+

+ This adress will be used to generate invoices and calculate shipping rates. Email adress you provide here will be used as a contact adress for your customers. +

+
+
+
+ + Plugin Settings + +
+
+
+
+
+
+
+ +
+ + +
+

+ Provide user or account details +

+
+
+
+
+ +
+ + +
+

+ Provide password or license details +

+
+
+
+
+
+
+
+ +
+`; + +exports[`Storyshots Views / Plugins / Plugin details form errors 1`] = ` +
+
+
+
+
+ Username or account Details +
+
+
+
+
+
+
+
+ Plugin Information and Status +
+

+ These are general information about your store. They define what is the URL of your store and what is shown in brow sers taskbar. +

+
+
+
+ + Plugin Information and Status + +
+
+
+
+
+
+ Plugin Name +
+

+ Username or account +

+
+ Plugin Description +
+

+ Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna. +

+
+
+
+ Status +
+
+
+
+ Plugin Settings +
+

+ This adress will be used to generate invoices and calculate shipping rates. Email adress you provide here will be used as a contact adress for your customers. +

+
+
+
+ + Plugin Settings + +
+
+
+
+
+
+
+ +
+ + +
+

+ Provide user or account details +

+
+
+
+
+ +
+ + +
+

+ Provide password or license details +

+
+
+
+
+
+
+
+ +
+`; + +exports[`Storyshots Views / Plugins / Plugin details loading 1`] = ` +
+
+
+
+
+ Details +
+
+
+
+
+
+
+
+ Plugin Information and Status +
+

+ These are general information about your store. They define what is the URL of your store and what is shown in brow sers taskbar. +

+
+
+
+ + Plugin Information and Status + +
+
+
+
+
+
+ Plugin Name +
+

+

+
+
+ Status +
+
+
+
+ Plugin Settings +
+

+ This adress will be used to generate invoices and calculate shipping rates. Email adress you provide here will be used as a contact adress for your customers. +

+
+
+
+ + Plugin Settings + +
+
+
+
+
+
+
+
+ +
+`; + +exports[`Storyshots Views / Plugins / Plugin list default 1`] = ` +
+
+
+
+ Plugins +
+
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + Name + + Active + + Action +
+
+
+
+ + No of Rows: + +
+
+
+ 20 +
+ + +
+
+
+
+
+ + +
+
+
+ + + Avalara + +
+ Yes +
+ 		+
+ +
+
+ + + VatLayer + +
+ No +
+ 		+
+ +
+
+ + + +`; + +exports[`Storyshots Views / Plugins / Plugin list loading 1`] = ` +
+
+
+
+ Plugins +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + +
+ + + Name + + Active + + Action +
+
+
+
+ + No of Rows: + +
+
+
+ 20 +
+ + +
+
+
+
+
+ + +
+
+
+ + + + ‌ + + + + ‌ + + +
+ +
+
+
+
+
+`; + +exports[`Storyshots Views / Plugins / Plugin list no data 1`] = ` +
+
+
+
+ Plugins +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + +
+ Name + + Active + + Action +
+
+
+
+ + No of Rows: + +
+
+
+ 20 +
+ + +
+
+
+
+
+ + +
+
+
+ No plugins found +
+
+
+
+`; + exports[`Storyshots Views / Product types / Create product type default 1`] = `
Date: Wed, 28 Aug 2019 15:14:54 +0200 Subject: [PATCH 11/24] Update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0f5bf9dbb..bd0bb9153 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,3 +10,4 @@ All notable, unreleased changes to this project will be documented in this file. - Add switch to make attribute available in product list as a column - #99 by @dominik-zeglen - Add tc tags for E2E testing - #134 by @dominik-zeglen - Use react-intl - #105 by @dominik-zeglen +- Add dynamic dashboard settings - #135 by @benekex2 From 66cd283d72c279e032112078e8e1f4583a183b77 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 15:50:03 +0200 Subject: [PATCH 12/24] Fix keys orders --- src/plugins/fixtures.ts | 55 ++++++++++--------- .../stories/plugins/PluginDetailsPage.tsx | 2 +- .../stories/plugins/PluginsListPage.tsx | 8 +-- 3 files changed, 33 insertions(+), 32 deletions(-) diff --git a/src/plugins/fixtures.ts b/src/plugins/fixtures.ts index b58634c4e..9859b843d 100644 --- a/src/plugins/fixtures.ts +++ b/src/plugins/fixtures.ts @@ -1,56 +1,57 @@ +import { ConfigurationTypeFieldEnum } from "@saleor/types/globalTypes"; import { PluginConfiguration_pluginConfiguration } from "./types/pluginConfiguration"; import { PluginConfigurations_pluginConfigurations_edges_node } from "./types/pluginConfigurations"; -import { ConfigurationTypeFieldEnum } from "@saleor/types/globalTypes"; export const pluginList: PluginConfigurations_pluginConfigurations_edges_node[] = [ { __typename: "PluginConfiguration", - id: "Jzx123sEt==", - name: "Avalara", + active: true, description: "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", - active: true + id: "Jzx123sEt==", + name: "Avalara" }, { __typename: "PluginConfiguration", - id: "Jzx123sEt==", - name: "VatLayer", + active: false, description: "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", - active: false + id: "Jzx123sEt==", + name: "VatLayer" } ]; export const plugin: PluginConfiguration_pluginConfiguration = { __typename: "PluginConfiguration", - id: "UGx1Z2luQ29uZmlndXJhdGlvbjoy", - name: "Username or account", - description: - "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", active: true, configuration: [ { __typename: "ConfigurationItem", - name: "Username or account", - value: "", - type: ConfigurationTypeFieldEnum.STRING, helpText: "Provide user or account details", - label: "Username or account" - }, - { - __typename: "ConfigurationItem", - name: "Password or license", - value: "", + label: "Username or account", + name: "Username or account", type: ConfigurationTypeFieldEnum.STRING, - helpText: "Provide password or license details", - label: "Password or license" + value: "" + }, + { + __typename: "ConfigurationItem", + helpText: "Provide password or license details", + label: "Password or license", + name: "Password or license", + type: ConfigurationTypeFieldEnum.STRING, + value: "" }, { __typename: "ConfigurationItem", - name: "Use sandbox", - value: "true", - type: ConfigurationTypeFieldEnum.BOOLEAN, helpText: "Determines if Saleor should use Avatax sandbox API.", - label: "Use sandbox" + label: "Use sandbox", + name: "Use sandbox", + type: ConfigurationTypeFieldEnum.BOOLEAN, + value: "true" } - ] + ], + description: + "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", + + id: "UGx1Z2luQ29uZmlndXJhdGlvbjoy", + name: "Username or account" }; diff --git a/src/storybook/stories/plugins/PluginDetailsPage.tsx b/src/storybook/stories/plugins/PluginDetailsPage.tsx index 55e9fae65..18aced41b 100644 --- a/src/storybook/stories/plugins/PluginDetailsPage.tsx +++ b/src/storybook/stories/plugins/PluginDetailsPage.tsx @@ -12,8 +12,8 @@ import { formError } from "../../misc"; const props: PluginsDetailsPageProps = { disabled: false, errors: [], - onSubmit: () => undefined, onBack: () => undefined, + onSubmit: () => undefined, plugin, saveButtonBarState: "default" }; diff --git a/src/storybook/stories/plugins/PluginsListPage.tsx b/src/storybook/stories/plugins/PluginsListPage.tsx index b94c445b4..673586800 100644 --- a/src/storybook/stories/plugins/PluginsListPage.tsx +++ b/src/storybook/stories/plugins/PluginsListPage.tsx @@ -10,12 +10,12 @@ import Decorator from "../../Decorator"; const props: PluginsListPageProps = { ...pageListProps.default, - toggle: () => undefined, - toggleAll: () => undefined, isChecked: () => undefined, - selected: undefined, onBack: () => undefined, - plugins: pluginList + plugins: pluginList, + selected: undefined, + toggle: () => undefined, + toggleAll: () => undefined }; storiesOf("Views / Plugins / Plugin list", module) From f6a8b8ce057c12ba5444ea18069c4a3cfad0a107 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 16:53:57 +0200 Subject: [PATCH 13/24] Rename PluginConfiguration to Plugin --- schema.graphql | 76 +++++++++++-------- .../components/PluginsList/PluginsList.tsx | 4 +- .../PluginsListPage/PluginsListPage.tsx | 4 +- src/plugins/fixtures.ts | 14 ++-- src/plugins/mutations.ts | 24 +++--- src/plugins/queries.ts | 46 ++++------- .../{pluginConfiguration.ts => Plugin.ts} | 16 ++-- src/plugins/types/PluginUpdate.ts | 48 ++++++++++++ src/plugins/types/Plugins.ts | 45 +++++++++++ .../types/pluginConfigurationUpdate.ts | 48 ------------ src/plugins/types/pluginConfigurations.ts | 45 ----------- src/plugins/types/pluginFragment.ts | 2 +- src/plugins/types/pluginsDetailsFragment.ts | 2 +- src/plugins/views/PluginsDetails.tsx | 30 +++----- src/plugins/views/PluginsList.tsx | 6 +- src/types/globalTypes.ts | 3 +- 16 files changed, 198 insertions(+), 215 deletions(-) rename src/plugins/types/{pluginConfiguration.ts => Plugin.ts} (54%) create mode 100644 src/plugins/types/PluginUpdate.ts create mode 100644 src/plugins/types/Plugins.ts delete mode 100644 src/plugins/types/pluginConfigurationUpdate.ts delete mode 100644 src/plugins/types/pluginConfigurations.ts diff --git a/schema.graphql b/schema.graphql index 5490d13e7..8b13a6034 100644 --- a/schema.graphql +++ b/schema.graphql @@ -143,8 +143,8 @@ type AssignNavigation { type Attribute implements Node { id: ID! - productTypes(before: String, after: String, first: Int, last: Int): ProductTypeCountableConnection - productVariantTypes(before: String, after: String, first: Int, last: Int): ProductTypeCountableConnection + productTypes(before: String, after: String, first: Int, last: Int): ProductTypeCountableConnection! + productVariantTypes(before: String, after: String, first: Int, last: Int): ProductTypeCountableConnection! privateMeta: [MetaStore]! meta: [MetaStore]! inputType: AttributeInputTypeEnum @@ -228,6 +228,7 @@ input AttributeFilterInput { filterableInDashboard: Boolean availableInGrid: Boolean search: String + ids: [ID] } input AttributeInput { @@ -518,7 +519,8 @@ type Checkout implements Node { shippingAddress: Address shippingMethod: ShippingMethod note: String! - discountAmount: Money + discountAmount: Money @deprecated(reason: "Use discount instead.") + discount: Money discountName: String translatedDiscountName: String voucherCode: String @@ -969,7 +971,6 @@ enum CountryCode { LT LU MO - MK MG MW MY @@ -1003,6 +1004,7 @@ enum CountryCode { NU NF KP + MK MP NO OM @@ -1867,6 +1869,7 @@ type Mutations { paymentCapture(amount: Decimal, paymentId: ID!): PaymentCapture paymentRefund(amount: Decimal, paymentId: ID!): PaymentRefund paymentVoid(paymentId: ID!): PaymentVoid + paymentSecureConfirm(paymentId: ID!): PaymentSecureConfirm pageCreate(input: PageInput!): PageCreate pageDelete(id: ID!): PageDelete pageBulkDelete(ids: [ID]!): PageBulkDelete @@ -1909,7 +1912,7 @@ type Mutations { giftCardCreate(input: GiftCardCreateInput!): GiftCardCreate giftCardDeactivate(id: ID!): GiftCardDeactivate giftCardUpdate(id: ID!, input: GiftCardUpdateInput!): GiftCardUpdate - pluginConfigurationUpdate(id: ID!, input: PluginConfigurationUpdateInput!): PluginConfigurationUpdate + pluginUpdate(id: ID!, input: PluginUpdateInput!): PluginUpdate saleCreate(input: SaleInput!): SaleCreate saleDelete(id: ID!): SaleDelete saleBulkDelete(ids: [ID]!): SaleBulkDelete @@ -1946,8 +1949,9 @@ type Mutations { checkoutClearMetadata(id: ID!, input: MetaPath!): CheckoutClearStoredMeta checkoutUpdatePrivateMetadata(id: ID!, input: MetaInput!): CheckoutUpdatePrivateMeta checkoutClearPrivateMetadata(id: ID!, input: MetaPath!): CheckoutClearStoredPrivateMeta - requestPasswordReset(email: String!): RequestPasswordReset - setPassword(id: ID!, input: SetPasswordInput!): SetPassword + requestPasswordReset(email: String!, redirectUrl: String!): RequestPasswordReset + setPassword(token: String!, email: String!, password: String!): SetPassword + passwordChange(newPassword: String!, oldPassword: String!): PasswordChange userUpdateMetadata(id: ID!, input: MetaInput!): UserUpdateMeta userClearStoredMetadata(id: ID!, input: MetaPath!): UserClearStoredMeta accountAddressCreate(input: AddressInput!, type: AddressTypeEnum): AccountAddressCreate @@ -1956,7 +1960,7 @@ type Mutations { accountSetDefaultAddress(id: ID!, type: AddressTypeEnum!): AccountSetDefaultAddress accountRegister(input: AccountRegisterInput!): AccountRegister accountUpdate(input: AccountInput!): AccountUpdate - accountRequestDeletion: AccountRequestDeletion + accountRequestDeletion(redirectUrl: String!): AccountRequestDeletion accountDelete(token: String!): AccountDelete customerPasswordReset(input: CustomerPasswordResetInput!): CustomerPasswordReset customerAddressCreate(input: AddressInput!, type: AddressTypeEnum): CustomerAddressCreate @@ -2011,12 +2015,12 @@ type Order implements Node { billingAddress: Address shippingAddress: Address shippingMethod: ShippingMethod - shippingPrice: TaxedMoney shippingMethodName: String + shippingPrice: TaxedMoney token: String! voucher: Voucher giftCards: [GiftCard] - discountAmount: Money + discount: Money discountName: String! translatedDiscountName: String! displayGrossPrices: Boolean! @@ -2041,6 +2045,7 @@ type Order implements Node { totalBalance: Money! userEmail: String isShippingRequired: Boolean! + discountAmount: Money! @deprecated(reason: "Deprecated: use discount instead.") } enum OrderAction { @@ -2341,6 +2346,11 @@ type PageUpdate { page: Page } +type PasswordChange { + errors: [Error!] + user: User +} + type PasswordReset { errors: [Error!] } @@ -2404,6 +2414,11 @@ type PaymentRefund { payment: Payment } +type PaymentSecureConfirm { + errors: [Error!] + payment: Payment +} + type PaymentSource { gateway: String! creditCardInfo: CreditCard @@ -2435,7 +2450,7 @@ enum PermissionEnum { MANAGE_TRANSLATIONS } -type PluginConfiguration implements Node { +type Plugin implements Node { name: String! description: String! active: Boolean! @@ -2443,23 +2458,23 @@ type PluginConfiguration implements Node { id: ID! } -type PluginConfigurationCountableConnection { +type PluginCountableConnection { pageInfo: PageInfo! - edges: [PluginConfigurationCountableEdge!]! + edges: [PluginCountableEdge!]! totalCount: Int } -type PluginConfigurationCountableEdge { - node: PluginConfiguration! +type PluginCountableEdge { + node: Plugin! cursor: String! } -type PluginConfigurationUpdate { +type PluginUpdate { errors: [Error!] - pluginConfiguration: PluginConfiguration + plugin: Plugin } -input PluginConfigurationUpdateInput { +input PluginUpdateInput { active: Boolean configuration: [ConfigurationItemInput] } @@ -2493,6 +2508,7 @@ type Product implements Node { isAvailable: Boolean basePrice: Money price: Money @deprecated(reason: "Has been replaced by 'basePrice'") + minimalVariantPrice: Money taxRate: TaxRateType @deprecated(reason: "taxRate is deprecated. Use taxType to obtain taxCode for given tax gateway") taxType: TaxType attributes: [SelectedAttribute!]! @@ -2579,6 +2595,7 @@ input ProductFilterInput { stockAvailability: StockAvailability productType: ID search: String + minimalPrice: PriceRangeInput } type ProductImage implements Node { @@ -2656,6 +2673,7 @@ input ProductOrder { enum ProductOrderField { NAME PRICE + MINIMAL_PRICE DATE } @@ -2748,6 +2766,7 @@ enum ProductTypeEnum { } input ProductTypeFilterInput { + search: String configurable: ProductTypeConfigurable productType: ProductTypeEnum } @@ -2925,7 +2944,7 @@ type Query { product(id: ID!): Product products(filter: ProductFilterInput, attributes: [AttributeScalar], categories: [ID], collections: [ID], priceLte: Float, priceGte: Float, sortBy: ProductOrder, stockAvailability: StockAvailability, query: String, before: String, after: String, first: Int, last: Int): ProductCountableConnection productType(id: ID!): ProductType - productTypes(filter: ProductTypeFilterInput, before: String, after: String, first: Int, last: Int): ProductTypeCountableConnection + productTypes(filter: ProductTypeFilterInput, query: String, before: String, after: String, first: Int, last: Int): ProductTypeCountableConnection productVariant(id: ID!): ProductVariant productVariants(ids: [ID], before: String, after: String, first: Int, last: Int): ProductVariantCountableConnection reportProductSales(period: ReportingPeriod!, before: String, after: String, first: Int, last: Int): ProductVariantCountableConnection @@ -2946,8 +2965,8 @@ type Query { menuItems(query: String, before: String, after: String, first: Int, last: Int): MenuItemCountableConnection giftCard(id: ID!): GiftCard giftCards(before: String, after: String, first: Int, last: Int): GiftCardCountableConnection - pluginConfiguration(id: ID!): PluginConfiguration - pluginConfigurations(before: String, after: String, first: Int, last: Int): PluginConfigurationCountableConnection + plugin(id: ID!): Plugin + plugins(before: String, after: String, first: Int, last: Int): PluginCountableConnection sale(id: ID!): Sale sales(filter: SaleFilterInput, query: String, before: String, after: String, first: Int, last: Int): SaleCountableConnection voucher(id: ID!): Voucher @@ -2957,7 +2976,7 @@ type Query { checkouts(before: String, after: String, first: Int, last: Int): CheckoutCountableConnection checkoutLine(id: ID): CheckoutLine checkoutLines(before: String, after: String, first: Int, last: Int): CheckoutLineCountableConnection - addressValidationRules(countryCode: CountryCode, countryArea: String, cityArea: String): AddressValidationData + addressValidationRules(countryCode: CountryCode!, countryArea: String, city: String, cityArea: String): AddressValidationData customers(filter: CustomerFilterInput, query: String, before: String, after: String, first: Int, last: Int): UserCountableConnection me: User staffUsers(filter: StaffUserInput, query: String, before: String, after: String, first: Int, last: Int): UserCountableConnection @@ -3089,15 +3108,11 @@ input SeoInput { } type SetPassword { - errors: [Error!] + token: String + errors: [Error]! user: User } -input SetPasswordInput { - token: String! - password: String! -} - type ShippingMethod implements Node { id: ID! name: String! @@ -3418,6 +3433,7 @@ enum TransactionKind { REFUND CAPTURE VOID + CONFIRM } union TranslatableItem = Product | Category | Collection | Attribute | AttributeValue | ProductVariant | Page | ShippingMethod | Sale | Voucher | MenuItem @@ -3466,7 +3482,6 @@ type User implements Node { firstName: String! lastName: String! isStaff: Boolean! - token: UUID! isActive: Boolean! note: String dateJoined: DateTime! @@ -3592,13 +3607,14 @@ type Voucher implements Node { applyOncePerCustomer: Boolean! discountValueType: DiscountValueTypeEnum! discountValue: Float! - minAmountSpent: Money + minSpent: Money minCheckoutItemsQuantity: Int categories(before: String, after: String, first: Int, last: Int): CategoryCountableConnection collections(before: String, after: String, first: Int, last: Int): CollectionCountableConnection products(before: String, after: String, first: Int, last: Int): ProductCountableConnection countries: [CountryDisplay] translation(languageCode: LanguageCodeEnum!): VoucherTranslation + minAmountSpent: Money @deprecated(reason: "Use the minSpent field instead.") } type VoucherAddCatalogues { diff --git a/src/plugins/components/PluginsList/PluginsList.tsx b/src/plugins/components/PluginsList/PluginsList.tsx index d6a575a43..1c2244465 100644 --- a/src/plugins/components/PluginsList/PluginsList.tsx +++ b/src/plugins/components/PluginsList/PluginsList.tsx @@ -21,10 +21,10 @@ import TablePagination from "@saleor/components/TablePagination"; import i18n from "@saleor/i18n"; import { maybe, renderCollection } from "@saleor/misc"; import { ListActionsWithoutToolbar, ListProps } from "@saleor/types"; -import { PluginConfigurations_pluginConfigurations_edges_node } from "../../types/pluginConfigurations"; +import { Plugins_plugins_edges_node } from "../../types/Plugins"; export interface PluginListProps extends ListProps, ListActionsWithoutToolbar { - plugins: PluginConfigurations_pluginConfigurations_edges_node[]; + plugins: Plugins_plugins_edges_node[]; } const styles = (theme: Theme) => diff --git a/src/plugins/components/PluginsListPage/PluginsListPage.tsx b/src/plugins/components/PluginsListPage/PluginsListPage.tsx index 81d0553f5..14fa2d467 100644 --- a/src/plugins/components/PluginsListPage/PluginsListPage.tsx +++ b/src/plugins/components/PluginsListPage/PluginsListPage.tsx @@ -5,13 +5,13 @@ import Container from "@saleor/components/Container"; import PageHeader from "@saleor/components/PageHeader"; import i18n from "@saleor/i18n"; import { ListActionsWithoutToolbar, PageListProps } from "@saleor/types"; -import { PluginConfigurations_pluginConfigurations_edges_node } from "../../types/PluginConfigurations"; +import { Plugins_plugins_edges_node } from "../../types/Plugins"; import PluginsList from "../PluginsList/PluginsList"; export interface PluginsListPageProps extends PageListProps, ListActionsWithoutToolbar { - plugins: PluginConfigurations_pluginConfigurations_edges_node[]; + plugins: Plugins_plugins_edges_node[]; onBack: () => void; } diff --git a/src/plugins/fixtures.ts b/src/plugins/fixtures.ts index 9859b843d..4da3ce27b 100644 --- a/src/plugins/fixtures.ts +++ b/src/plugins/fixtures.ts @@ -1,10 +1,10 @@ import { ConfigurationTypeFieldEnum } from "@saleor/types/globalTypes"; -import { PluginConfiguration_pluginConfiguration } from "./types/pluginConfiguration"; -import { PluginConfigurations_pluginConfigurations_edges_node } from "./types/pluginConfigurations"; +import { Plugin_plugin } from "./types/Plugin"; +import { Plugins_plugins_edges_node } from "./types/Plugins"; -export const pluginList: PluginConfigurations_pluginConfigurations_edges_node[] = [ +export const pluginList: Plugins_plugins_edges_node[] = [ { - __typename: "PluginConfiguration", + __typename: "Plugin", active: true, description: "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", @@ -12,7 +12,7 @@ export const pluginList: PluginConfigurations_pluginConfigurations_edges_node[] name: "Avalara" }, { - __typename: "PluginConfiguration", + __typename: "Plugin", active: false, description: "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna.", @@ -20,8 +20,8 @@ export const pluginList: PluginConfigurations_pluginConfigurations_edges_node[] name: "VatLayer" } ]; -export const plugin: PluginConfiguration_pluginConfiguration = { - __typename: "PluginConfiguration", +export const plugin: Plugin_plugin = { + __typename: "Plugin", active: true, configuration: [ { diff --git a/src/plugins/mutations.ts b/src/plugins/mutations.ts index a5f1834a9..d7939eef7 100644 --- a/src/plugins/mutations.ts +++ b/src/plugins/mutations.ts @@ -2,29 +2,23 @@ import gql from "graphql-tag"; import { TypedMutation } from "../mutations"; import { pluginsDetailsFragment } from "./queries"; -import { - PluginConfigurationUpdate, - PluginConfigurationUpdateVariables -} from "./types/pluginConfigurationUpdate"; +import { PluginUpdate, PluginUpdateVariables } from "./types/pluginUpdate"; -const pluginConfigurationUpdate = gql` +const pluginUpdate = gql` ${pluginsDetailsFragment} - mutation PluginConfigurationUpdate( - $id: ID! - $input: PluginConfigurationUpdateInput! - ) { - pluginConfigurationUpdate(id: $id, input: $input) { + mutation PluginUpdate($id: ID!, $input: PluginUpdateInput!) { + pluginUpdate(id: $id, input: $input) { errors { field message } - pluginConfiguration { + plugin { ...pluginsDetailsFragment } } } `; -export const TypedPluginConfigurationUpdate = TypedMutation< - PluginConfigurationUpdate, - PluginConfigurationUpdateVariables ->(pluginConfigurationUpdate); +export const TypedPluginUpdate = TypedMutation< + PluginUpdate, + PluginUpdateVariables +>(pluginUpdate); diff --git a/src/plugins/queries.ts b/src/plugins/queries.ts index 518895048..965244f73 100644 --- a/src/plugins/queries.ts +++ b/src/plugins/queries.ts @@ -1,17 +1,11 @@ import gql from "graphql-tag"; import { TypedQuery } from "../queries"; -import { - PluginConfiguration, - PluginConfigurationVariables -} from "./types/pluginConfiguration"; -import { - PluginConfigurations, - PluginConfigurationsVariables -} from "./types/pluginConfigurations"; +import { Plugin, PluginVariables } from "./types/Plugin"; +import { Plugins, PluginsVariables } from "./types/Plugins"; export const pluginsFragment = gql` - fragment pluginFragment on PluginConfiguration { + fragment pluginFragment on Plugin { id name description @@ -21,7 +15,7 @@ export const pluginsFragment = gql` export const pluginsDetailsFragment = gql` ${pluginsFragment} - fragment pluginsDetailsFragment on PluginConfiguration { + fragment pluginsDetailsFragment on Plugin { ...pluginFragment configuration { name @@ -35,18 +29,8 @@ export const pluginsDetailsFragment = gql` const pluginsList = gql` ${pluginsFragment} - query PluginConfigurations( - $first: Int - $after: String - $last: Int - $before: String - ) { - pluginConfigurations( - before: $before - after: $after - first: $first - last: $last - ) { + query Plugins($first: Int, $after: String, $last: Int, $before: String) { + plugins(before: $before, after: $after, first: $first, last: $last) { edges { node { ...pluginFragment @@ -61,20 +45,18 @@ const pluginsList = gql` } } `; -export const TypedPluginsListQuery = TypedQuery< - PluginConfigurations, - PluginConfigurationsVariables ->(pluginsList); +export const TypedPluginsListQuery = TypedQuery( + pluginsList +); const pluginsDetails = gql` ${pluginsDetailsFragment} - query PluginConfiguration($id: ID!) { - pluginConfiguration(id: $id) { + query Plugin($id: ID!) { + plugin(id: $id) { ...pluginsDetailsFragment } } `; -export const TypedPluginsDetailsQuery = TypedQuery< - PluginConfiguration, - PluginConfigurationVariables ->(pluginsDetails); +export const TypedPluginsDetailsQuery = TypedQuery( + pluginsDetails +); diff --git a/src/plugins/types/pluginConfiguration.ts b/src/plugins/types/Plugin.ts similarity index 54% rename from src/plugins/types/pluginConfiguration.ts rename to src/plugins/types/Plugin.ts index 9a339ce17..66fc7b47f 100644 --- a/src/plugins/types/pluginConfiguration.ts +++ b/src/plugins/types/Plugin.ts @@ -5,10 +5,10 @@ import { ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; // ==================================================== -// GraphQL query operation: PluginConfiguration +// GraphQL query operation: Plugin // ==================================================== -export interface PluginConfiguration_pluginConfiguration_configuration { +export interface Plugin_plugin_configuration { __typename: "ConfigurationItem"; name: string; type: ConfigurationTypeFieldEnum | null; @@ -17,19 +17,19 @@ export interface PluginConfiguration_pluginConfiguration_configuration { label: string | null; } -export interface PluginConfiguration_pluginConfiguration { - __typename: "PluginConfiguration"; +export interface Plugin_plugin { + __typename: "Plugin"; id: string; name: string; description: string; active: boolean; - configuration: (PluginConfiguration_pluginConfiguration_configuration | null)[] | null; + configuration: (Plugin_plugin_configuration | null)[] | null; } -export interface PluginConfiguration { - pluginConfiguration: PluginConfiguration_pluginConfiguration | null; +export interface Plugin { + plugin: Plugin_plugin | null; } -export interface PluginConfigurationVariables { +export interface PluginVariables { id: string; } diff --git a/src/plugins/types/PluginUpdate.ts b/src/plugins/types/PluginUpdate.ts new file mode 100644 index 000000000..90337d98d --- /dev/null +++ b/src/plugins/types/PluginUpdate.ts @@ -0,0 +1,48 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +import { PluginUpdateInput, ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; + +// ==================================================== +// GraphQL mutation operation: PluginUpdate +// ==================================================== + +export interface PluginUpdate_pluginUpdate_errors { + __typename: "Error"; + field: string | null; + message: string | null; +} + +export interface PluginUpdate_pluginUpdate_plugin_configuration { + __typename: "ConfigurationItem"; + name: string; + type: ConfigurationTypeFieldEnum | null; + value: string; + helpText: string | null; + label: string | null; +} + +export interface PluginUpdate_pluginUpdate_plugin { + __typename: "Plugin"; + id: string; + name: string; + description: string; + active: boolean; + configuration: (PluginUpdate_pluginUpdate_plugin_configuration | null)[] | null; +} + +export interface PluginUpdate_pluginUpdate { + __typename: "PluginUpdate"; + errors: PluginUpdate_pluginUpdate_errors[] | null; + plugin: PluginUpdate_pluginUpdate_plugin | null; +} + +export interface PluginUpdate { + pluginUpdate: PluginUpdate_pluginUpdate | null; +} + +export interface PluginUpdateVariables { + id: string; + input: PluginUpdateInput; +} diff --git a/src/plugins/types/Plugins.ts b/src/plugins/types/Plugins.ts new file mode 100644 index 000000000..c8861ad45 --- /dev/null +++ b/src/plugins/types/Plugins.ts @@ -0,0 +1,45 @@ +/* tslint:disable */ +/* eslint-disable */ +// This file was automatically generated and should not be edited. + +// ==================================================== +// GraphQL query operation: Plugins +// ==================================================== + +export interface Plugins_plugins_edges_node { + __typename: "Plugin"; + id: string; + name: string; + description: string; + active: boolean; +} + +export interface Plugins_plugins_edges { + __typename: "PluginCountableEdge"; + node: Plugins_plugins_edges_node; +} + +export interface Plugins_plugins_pageInfo { + __typename: "PageInfo"; + hasPreviousPage: boolean; + hasNextPage: boolean; + startCursor: string | null; + endCursor: string | null; +} + +export interface Plugins_plugins { + __typename: "PluginCountableConnection"; + edges: Plugins_plugins_edges[]; + pageInfo: Plugins_plugins_pageInfo; +} + +export interface Plugins { + plugins: Plugins_plugins | null; +} + +export interface PluginsVariables { + first?: number | null; + after?: string | null; + last?: number | null; + before?: string | null; +} diff --git a/src/plugins/types/pluginConfigurationUpdate.ts b/src/plugins/types/pluginConfigurationUpdate.ts deleted file mode 100644 index fbd7db2a9..000000000 --- a/src/plugins/types/pluginConfigurationUpdate.ts +++ /dev/null @@ -1,48 +0,0 @@ -/* tslint:disable */ -/* eslint-disable */ -// This file was automatically generated and should not be edited. - -import { PluginConfigurationUpdateInput, ConfigurationTypeFieldEnum } from "./../../types/globalTypes"; - -// ==================================================== -// GraphQL mutation operation: PluginConfigurationUpdate -// ==================================================== - -export interface PluginConfigurationUpdate_pluginConfigurationUpdate_errors { - __typename: "Error"; - field: string | null; - message: string | null; -} - -export interface PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration { - __typename: "ConfigurationItem"; - name: string; - type: ConfigurationTypeFieldEnum | null; - value: string; - helpText: string | null; - label: string | null; -} - -export interface PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration { - __typename: "PluginConfiguration"; - id: string; - name: string; - description: string; - active: boolean; - configuration: (PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration_configuration | null)[] | null; -} - -export interface PluginConfigurationUpdate_pluginConfigurationUpdate { - __typename: "PluginConfigurationUpdate"; - errors: PluginConfigurationUpdate_pluginConfigurationUpdate_errors[] | null; - pluginConfiguration: PluginConfigurationUpdate_pluginConfigurationUpdate_pluginConfiguration | null; -} - -export interface PluginConfigurationUpdate { - pluginConfigurationUpdate: PluginConfigurationUpdate_pluginConfigurationUpdate | null; -} - -export interface PluginConfigurationUpdateVariables { - id: string; - input: PluginConfigurationUpdateInput; -} diff --git a/src/plugins/types/pluginConfigurations.ts b/src/plugins/types/pluginConfigurations.ts deleted file mode 100644 index cf8b48ce9..000000000 --- a/src/plugins/types/pluginConfigurations.ts +++ /dev/null @@ -1,45 +0,0 @@ -/* tslint:disable */ -/* eslint-disable */ -// This file was automatically generated and should not be edited. - -// ==================================================== -// GraphQL query operation: PluginConfigurations -// ==================================================== - -export interface PluginConfigurations_pluginConfigurations_edges_node { - __typename: "PluginConfiguration"; - id: string; - name: string; - description: string; - active: boolean; -} - -export interface PluginConfigurations_pluginConfigurations_edges { - __typename: "PluginConfigurationCountableEdge"; - node: PluginConfigurations_pluginConfigurations_edges_node; -} - -export interface PluginConfigurations_pluginConfigurations_pageInfo { - __typename: "PageInfo"; - hasPreviousPage: boolean; - hasNextPage: boolean; - startCursor: string | null; - endCursor: string | null; -} - -export interface PluginConfigurations_pluginConfigurations { - __typename: "PluginConfigurationCountableConnection"; - edges: PluginConfigurations_pluginConfigurations_edges[]; - pageInfo: PluginConfigurations_pluginConfigurations_pageInfo; -} - -export interface PluginConfigurations { - pluginConfigurations: PluginConfigurations_pluginConfigurations | null; -} - -export interface PluginConfigurationsVariables { - first?: number | null; - after?: string | null; - last?: number | null; - before?: string | null; -} diff --git a/src/plugins/types/pluginFragment.ts b/src/plugins/types/pluginFragment.ts index a1e6f5f6c..52d893eb5 100644 --- a/src/plugins/types/pluginFragment.ts +++ b/src/plugins/types/pluginFragment.ts @@ -7,7 +7,7 @@ // ==================================================== export interface pluginFragment { - __typename: "PluginConfiguration"; + __typename: "Plugin"; id: string; name: string; description: string; diff --git a/src/plugins/types/pluginsDetailsFragment.ts b/src/plugins/types/pluginsDetailsFragment.ts index 3a925ef75..35158f77f 100644 --- a/src/plugins/types/pluginsDetailsFragment.ts +++ b/src/plugins/types/pluginsDetailsFragment.ts @@ -18,7 +18,7 @@ export interface pluginsDetailsFragment_configuration { } export interface pluginsDetailsFragment { - __typename: "PluginConfiguration"; + __typename: "Plugin"; id: string; name: string; description: string; diff --git a/src/plugins/views/PluginsDetails.tsx b/src/plugins/views/PluginsDetails.tsx index 840ba1f16..ca2240bdc 100644 --- a/src/plugins/views/PluginsDetails.tsx +++ b/src/plugins/views/PluginsDetails.tsx @@ -4,7 +4,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle"; import useNavigator from "@saleor/hooks/useNavigator"; import { getMutationState, maybe } from "../../misc"; import PluginsDetailsPage from "../components/PluginsDetailsPage"; -import { TypedPluginConfigurationUpdate } from "../mutations"; +import { TypedPluginUpdate } from "../mutations"; import { TypedPluginsDetailsQuery } from "../queries"; import { pluginsListUrl, PluginsListUrlQueryParams } from "../urls"; @@ -19,37 +19,29 @@ export const PluginsDetails: React.StatelessComponent = ({ const navigate = useNavigator(); return ( - - {(pluginConfigurationUpdate, pluginConfigurationUpdateOpts) => ( + + {(pluginUpdate, pluginUpdateOpts) => ( {PluginDetails => { const formTransitionState = getMutationState( - pluginConfigurationUpdateOpts.called, - pluginConfigurationUpdateOpts.loading, - maybe( - () => - pluginConfigurationUpdateOpts.data.pluginConfigurationUpdate - .errors - ) + pluginUpdateOpts.called, + pluginUpdateOpts.loading, + maybe(() => pluginUpdateOpts.data.pluginUpdate.errors) ); return ( <> PluginDetails.data.pluginConfiguration.name - )} + title={maybe(() => PluginDetails.data.plugin.name)} /> - pluginConfigurationUpdateOpts.data - .pluginConfigurationUpdate.errors, + () => pluginUpdateOpts.data.pluginUpdate.errors, [] )} saveButtonBarState={formTransitionState} - plugin={maybe(() => PluginDetails.data.pluginConfiguration)} + plugin={maybe(() => PluginDetails.data.plugin)} onBack={() => navigate(pluginsListUrl())} onSubmit={formData => { const configurationInput = []; @@ -59,7 +51,7 @@ export const PluginsDetails: React.StatelessComponent = ({ value: item.value.toString() }); }); - pluginConfigurationUpdate({ + pluginUpdate({ variables: { id, input: { @@ -75,7 +67,7 @@ export const PluginsDetails: React.StatelessComponent = ({ }} )} - + ); }; PluginsDetails.displayName = "PluginsDetails"; diff --git a/src/plugins/views/PluginsList.tsx b/src/plugins/views/PluginsList.tsx index 58d2ea0c4..fdda7d422 100644 --- a/src/plugins/views/PluginsList.tsx +++ b/src/plugins/views/PluginsList.tsx @@ -33,7 +33,7 @@ export const PluginsList: React.StatelessComponent = ({ {({ data, loading }) => { const { loadNextPage, loadPreviousPage, pageInfo } = paginate( - maybe(() => data.pluginConfigurations.pageInfo), + maybe(() => data.plugins.pageInfo), paginationState, params ); @@ -42,9 +42,7 @@ export const PluginsList: React.StatelessComponent = ({ - data.pluginConfigurations.edges.map(edge => edge.node) - )} + plugins={maybe(() => data.plugins.edges.map(edge => edge.node))} pageInfo={pageInfo} onAdd={() => navigate(configurationMenuUrl)} onBack={() => navigate(configurationMenuUrl)} diff --git a/src/types/globalTypes.ts b/src/types/globalTypes.ts index 35cf5faaf..6fa1712cc 100644 --- a/src/types/globalTypes.ts +++ b/src/types/globalTypes.ts @@ -476,7 +476,7 @@ export interface PageTranslationInput { contentJson?: any | null; } -export interface PluginConfigurationUpdateInput { +export interface PluginUpdateInput { active?: boolean | null; configuration?: (ConfigurationItemInput | null)[] | null; } @@ -495,6 +495,7 @@ export interface ProductFilterInput { stockAvailability?: StockAvailability | null; productType?: string | null; search?: string | null; + minimalPrice?: PriceRangeInput | null; } export interface ProductTypeInput { From e3ff288fce88f70ee329decedd624ce820f1f3f4 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 17:01:46 +0200 Subject: [PATCH 14/24] Fix typo --- src/plugins/mutations.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/plugins/mutations.ts b/src/plugins/mutations.ts index d7939eef7..a7c0d99bc 100644 --- a/src/plugins/mutations.ts +++ b/src/plugins/mutations.ts @@ -2,7 +2,7 @@ import gql from "graphql-tag"; import { TypedMutation } from "../mutations"; import { pluginsDetailsFragment } from "./queries"; -import { PluginUpdate, PluginUpdateVariables } from "./types/pluginUpdate"; +import { PluginUpdate, PluginUpdateVariables } from "./types/PluginUpdate"; const pluginUpdate = gql` ${pluginsDetailsFragment} From 0184e92e53bbfbc8df009b0fdbb1a55b51235863 Mon Sep 17 00:00:00 2001 From: Krzysztof Bialoglowicz Date: Wed, 28 Aug 2019 17:12:36 +0200 Subject: [PATCH 15/24] Update snapshots --- src/storybook/__snapshots__/Stories.test.ts.snap | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap index 6b7ce8319..be3b27689 100644 --- a/src/storybook/__snapshots__/Stories.test.ts.snap +++ b/src/storybook/__snapshots__/Stories.test.ts.snap @@ -75138,6 +75138,7 @@ exports[`Storyshots Views / Plugins / Plugin list default 1`] = ` >