Move fragments to avoid circular imports

src/attributes/components/AttributeDetails/AttributeDetails.tsx

@@ -1,11 +1,11 @@
 import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import CardTitle from "@saleor/components/CardTitle";
 import ControlledCheckbox from "@saleor/components/ControlledCheckbox";
 import FormSpacer from "@saleor/components/FormSpacer";
 import SingleSelectField from "@saleor/components/SingleSelectField";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { AttributeInputTypeEnum } from "@saleor/types/globalTypes";
 import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";

src/attributes/components/AttributePage/AttributePage.tsx

@@ -1,4 +1,3 @@
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import AppHeader from "@saleor/components/AppHeader";
 import CardSpacer from "@saleor/components/CardSpacer";
 import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
@@ -7,6 +6,11 @@ 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 {
+  AttributeDetailsFragment,
+  AttributeDetailsFragment_values
+} from "@saleor/fragments/types/AttributeDetailsFragment";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import { maybe } from "@saleor/misc";
 import { ReorderAction } from "@saleor/types";
@@ -15,10 +19,6 @@ import React from "react";
 import { useIntl } from "react-intl";
 import slugify from "slugify";
 
-import {
-  AttributeDetailsFragment,
-  AttributeDetailsFragment_values
-} from "../../types/AttributeDetailsFragment";
 import AttributeDetails from "../AttributeDetails";
 import AttributeProperties from "../AttributeProperties";
 import AttributeValues from "../AttributeValues";

src/attributes/components/AttributeProperties/AttributeProperties.tsx

@@ -2,12 +2,12 @@ import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
 import Typography from "@material-ui/core/Typography";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import CardSpacer from "@saleor/components/CardSpacer";
 import CardTitle from "@saleor/components/CardTitle";
 import ControlledCheckbox from "@saleor/components/ControlledCheckbox";
 import FormSpacer from "@saleor/components/FormSpacer";
 import Hr from "@saleor/components/Hr";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";
 import React from "react";

src/attributes/components/AttributeValueEditDialog/AttributeValueEditDialog.tsx

@@ -5,11 +5,11 @@ import DialogContent from "@material-ui/core/DialogContent";
 import DialogTitle from "@material-ui/core/DialogTitle";
 import TextField from "@material-ui/core/TextField";
 import { getAttributeValueErrorMessage } from "@saleor/attributes/errors";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import ConfirmButton, {
   ConfirmButtonTransitionState
 } from "@saleor/components/ConfirmButton";
 import Form from "@saleor/components/Form";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import useModalDialogErrors from "@saleor/hooks/useModalDialogErrors";
 import { buttonMessages } from "@saleor/intl";
 import { maybe } from "@saleor/misc";

src/attributes/components/AttributeValues/AttributeValues.tsx

@@ -13,13 +13,12 @@ import {
   SortableTableBody,
   SortableTableRow
 } from "@saleor/components/SortableTable";
+import { AttributeDetailsFragment_values } from "@saleor/fragments/types/AttributeDetailsFragment";
 import { maybe, renderCollection, stopPropagation } from "@saleor/misc";
 import { ReorderAction } from "@saleor/types";
 import React from "react";
 import { FormattedMessage, useIntl } from "react-intl";
 
-import { AttributeDetailsFragment_values } from "../../types/AttributeDetailsFragment";
-
 export interface AttributeValuesProps {
   disabled: boolean;
   values: AttributeDetailsFragment_values[];

src/attributes/errors.ts

@@ -1,9 +1,8 @@
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { ProductErrorCode } from "@saleor/types/globalTypes";
 import { getProductErrorMessage } from "@saleor/utils/errors";
 import { defineMessages, IntlShape } from "react-intl";
 
-import { ProductErrorFragment } from "./types/ProductErrorFragment";
-
 const messages = defineMessages({
   attributeSlugUnique: {
     defaultMessage: "Attribute with this slug already exists"

src/attributes/fixtures.ts

@@ -1,10 +1,10 @@
+import { AttributeDetailsFragment } from "@saleor/fragments/types/AttributeDetailsFragment";
 import { ProductDetails_product_productType_variantAttributes } from "@saleor/products/types/ProductDetails";
 import {
   AttributeInputTypeEnum,
   AttributeValueType
 } from "@saleor/types/globalTypes";
 
-import { AttributeDetailsFragment } from "./types/AttributeDetailsFragment";
 import { AttributeList_attributes_edges_node } from "./types/AttributeList";
 
 export const attribute: AttributeDetailsFragment = {

src/attributes/mutations.ts

@@ -1,7 +1,8 @@
+import { attributeDetailsFragment } from "@saleor/fragments/attributes";
+import { productErrorFragment } from "@saleor/fragments/errors";
 import { TypedMutation } from "@saleor/mutations";
 import gql from "graphql-tag";
 
-import { attributeDetailsFragment } from "./queries";
 import {
   AttributeBulkDelete,
   AttributeBulkDeleteVariables
@@ -35,13 +36,6 @@ import {
   AttributeValueUpdateVariables
 } from "./types/AttributeValueUpdate";
 
-export const productErrorFragment = gql`
-  fragment ProductErrorFragment on ProductError {
-    code
-    field
-  }
-`;
-
 const attributeBulkDelete = gql`
   ${productErrorFragment}
   mutation AttributeBulkDelete($ids: [ID!]!) {

src/attributes/queries.ts

@@ -1,41 +1,18 @@
+import {
+  attributeDetailsFragment,
+  attributeFragment
+} from "@saleor/fragments/attributes";
+import { pageInfoFragment } from "@saleor/fragments/pageInfo";
 import makeQuery from "@saleor/hooks/makeQuery";
 import gql from "graphql-tag";
 
-import { pageInfoFragment, TypedQuery } from "../queries";
+import { TypedQuery } from "../queries";
 import {
   AttributeDetails,
   AttributeDetailsVariables
 } from "./types/AttributeDetails";
 import { AttributeList, AttributeListVariables } from "./types/AttributeList";
 
-export const attributeFragment = gql`
-  fragment AttributeFragment on Attribute {
-    id
-    name
-    slug
-    visibleInStorefront
-    filterableInDashboard
-    filterableInStorefront
-  }
-`;
-
-export const attributeDetailsFragment = gql`
-  ${attributeFragment}
-  fragment AttributeDetailsFragment on Attribute {
-    ...AttributeFragment
-    availableInGrid
-    inputType
-    storefrontSearchPosition
-    valueRequired
-    values {
-      id
-      name
-      slug
-      type
-    }
-  }
-`;
-
 const attributeDetails = gql`
   ${attributeDetailsFragment}
   query AttributeDetails($id: ID!) {

src/attributes/views/AttributeCreate/AttributeCreate.tsx

@@ -1,4 +1,4 @@
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
 import { maybe } from "@saleor/misc";

src/auth/AuthProvider.tsx

@@ -1,4 +1,5 @@
 import { DEMO_MODE } from "@saleor/config";
+import { User } from "@saleor/fragments/types/User";
 import useNotifier from "@saleor/hooks/useNotifier";
 import { maybe } from "@saleor/misc";
 import {
@@ -18,7 +19,6 @@ import {
 } from "./mutations";
 import { RefreshToken, RefreshTokenVariables } from "./types/RefreshToken";
 import { TokenAuth, TokenAuthVariables } from "./types/TokenAuth";
-import { User } from "./types/User";
 import { VerifyToken, VerifyTokenVariables } from "./types/VerifyToken";
 import {
   displayDemoMessage,

src/auth/index.tsx

@@ -1,9 +1,9 @@
+import { User } from "@saleor/fragments/types/User";
 import React from "react";
 import { Route, Switch } from "react-router-dom";
 
 import Layout from "./components/Layout";
 import LoginLoading from "./components/LoginLoading";
-import { User } from "./types/User";
 import {
   newPasswordPath,
   passwordResetPath,

src/auth/misc.ts

@@ -1,5 +1,6 @@
+import { User } from "@saleor/fragments/types/User";
+
 import { PermissionEnum } from "../types/globalTypes";
-import { User } from "./types/User";
 
 export const hasPermission = (permission: PermissionEnum, user: User) =>
   user.userPermissions.map(perm => perm.code).includes(permission);

src/auth/mutations.ts

@@ -1,4 +1,5 @@
-import { accountErrorFragment } from "@saleor/customers/mutations";
+import { fragmentUser } from "@saleor/fragments/auth";
+import { accountErrorFragment } from "@saleor/fragments/errors";
 import gql from "graphql-tag";
 
 import { TypedMutation } from "../mutations";
@@ -11,22 +12,6 @@ import { SetPassword, SetPasswordVariables } from "./types/SetPassword";
 import { TokenAuth, TokenAuthVariables } from "./types/TokenAuth";
 import { VerifyToken, VerifyTokenVariables } from "./types/VerifyToken";
 
-export const fragmentUser = gql`
-  fragment User on User {
-    id
-    email
-    firstName
-    lastName
-    userPermissions {
-      code
-      name
-    }
-    avatar {
-      url
-    }
-  }
-`;
-
 export const tokenAuthMutation = gql`
   ${fragmentUser}
   mutation TokenAuth($email: String!, $password: String!) {

src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx

@@ -1,4 +1,3 @@
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import AppHeader from "@saleor/components/AppHeader";
 import { CardSpacer } from "@saleor/components/CardSpacer";
 import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
@@ -7,6 +6,7 @@ import Form from "@saleor/components/Form";
 import PageHeader from "@saleor/components/PageHeader";
 import SaveButtonBar from "@saleor/components/SaveButtonBar";
 import SeoForm from "@saleor/components/SeoForm";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import { ContentState, convertToRaw, RawDraftContentState } from "draft-js";
 import React from "react";

src/categories/components/CategoryDetailsForm/CategoryDetailsForm.tsx

@@ -1,10 +1,10 @@
 import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import CardTitle from "@saleor/components/CardTitle";
 import FormSpacer from "@saleor/components/FormSpacer";
 import RichTextEditor from "@saleor/components/RichTextEditor";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";
 import { RawDraftContentState } from "draft-js";

src/categories/components/CategoryList/CategoryList.tsx

@@ -3,7 +3,6 @@ import TableBody from "@material-ui/core/TableBody";
 import TableCell from "@material-ui/core/TableCell";
 import TableFooter from "@material-ui/core/TableFooter";
 import TableRow from "@material-ui/core/TableRow";
-import { CategoryFragment } from "@saleor/categories/types/CategoryFragment";
 import { CategoryListUrlSortField } from "@saleor/categories/urls";
 import Checkbox from "@saleor/components/Checkbox";
 import ResponsiveTable from "@saleor/components/ResponsiveTable";
@@ -11,6 +10,7 @@ import Skeleton from "@saleor/components/Skeleton";
 import TableCellHeader from "@saleor/components/TableCellHeader";
 import TableHead from "@saleor/components/TableHead";
 import TablePagination from "@saleor/components/TablePagination";
+import { CategoryFragment } from "@saleor/fragments/types/CategoryFragment";
 import { maybe, renderCollection } from "@saleor/misc";
 import { ListActions, ListProps, SortPage } from "@saleor/types";
 import { getArrowDirection } from "@saleor/utils/sort";

src/categories/components/CategoryListPage/CategoryListPage.tsx

@@ -1,10 +1,10 @@
 import Button from "@material-ui/core/Button";
 import Card from "@material-ui/core/Card";
-import { CategoryFragment } from "@saleor/categories/types/CategoryFragment";
 import { CategoryListUrlSortField } from "@saleor/categories/urls";
 import Container from "@saleor/components/Container";
 import PageHeader from "@saleor/components/PageHeader";
 import SearchBar from "@saleor/components/SearchBar";
+import { CategoryFragment } from "@saleor/fragments/types/CategoryFragment";
 import { sectionNames } from "@saleor/intl";
 import {
   ListActions,

src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx

@@ -1,6 +1,5 @@
 import Button from "@material-ui/core/Button";
 import Card from "@material-ui/core/Card";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import AppHeader from "@saleor/components/AppHeader";
 import { CardSpacer } from "@saleor/components/CardSpacer";
 import CardTitle from "@saleor/components/CardTitle";
@@ -11,6 +10,7 @@ import PageHeader from "@saleor/components/PageHeader";
 import SaveButtonBar from "@saleor/components/SaveButtonBar";
 import SeoForm from "@saleor/components/SeoForm";
 import { Tab, TabContainer } from "@saleor/components/Tab";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import { RawDraftContentState } from "draft-js";
 import React from "react";

src/categories/fixtures.ts

@@ -1,6 +1,7 @@
+import { CategoryFragment } from "@saleor/fragments/types/CategoryFragment";
+
 import { content } from "../storybook/stories/components/RichTextEditor";
 import { CategoryDetails_category } from "./types/CategoryDetails";
-import { CategoryFragment } from "./types/CategoryFragment";
 
 export const categories: CategoryFragment[] = [
   {

src/categories/mutations.ts

@@ -1,8 +1,8 @@
-import { productErrorFragment } from "@saleor/attributes/mutations";
+import { categoryDetailsFragment } from "@saleor/fragments/categories";
+import { productErrorFragment } from "@saleor/fragments/errors";
 import makeMutation from "@saleor/hooks/makeMutation";
 import gql from "graphql-tag";
 
-import { categoryDetailsFragment } from "./queries";
 import {
   CategoryBulkDelete,
   CategoryBulkDeleteVariables

src/categories/queries.ts

@@ -1,43 +1,18 @@
+import {
+  categoryDetailsFragment,
+  categoryFragment
+} from "@saleor/fragments/categories";
+import { pageInfoFragment } from "@saleor/fragments/pageInfo";
+import { fragmentMoney } from "@saleor/fragments/products";
 import makeQuery from "@saleor/hooks/makeQuery";
-import { fragmentMoney } from "@saleor/products/queries";
 import gql from "graphql-tag";
 
-import { pageInfoFragment } from "../queries";
 import {
   CategoryDetails,
   CategoryDetailsVariables
 } from "./types/CategoryDetails";
 import { RootCategories } from "./types/RootCategories";
 
-export const categoryFragment = gql`
-  fragment CategoryFragment on Category {
-    id
-    name
-    children {
-      totalCount
-    }
-    products {
-      totalCount
-    }
-  }
-`;
-export const categoryDetailsFragment = gql`
-  fragment CategoryDetailsFragment on Category {
-    id
-    backgroundImage {
-      alt
-      url
-    }
-    name
-    descriptionJson
-    seoDescription
-    seoTitle
-    parent {
-      id
-    }
-  }
-`;
-
 export const rootCategories = gql`
   ${categoryFragment}
   ${pageInfoFragment}

src/categories/types/CategoryProperties.ts

@@ -1,95 +0,0 @@
-/* tslint:disable */
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL query operation: CategoryProperties
-// ====================================================
-
-export interface CategoryProperties_category_parent {
-  __typename: "Category";
-  id: string;
-}
-
-export interface CategoryProperties_category_children_edges_node_children {
-  __typename: "CategoryCountableConnection";
-  totalCount: number | null;
-}
-
-export interface CategoryProperties_category_children_edges_node_products {
-  __typename: "ProductCountableConnection";
-  totalCount: number | null;
-}
-
-export interface CategoryProperties_category_children_edges_node {
-  __typename: "Category";
-  id: string;
-  name: string;
-  children: CategoryProperties_category_children_edges_node_children | null;
-  products: CategoryProperties_category_children_edges_node_products | null;
-}
-
-export interface CategoryProperties_category_children_edges {
-  __typename: "CategoryCountableEdge";
-  node: CategoryProperties_category_children_edges_node;
-}
-
-export interface CategoryProperties_category_children {
-  __typename: "CategoryCountableConnection";
-  edges: CategoryProperties_category_children_edges[];
-}
-
-export interface CategoryProperties_category_products_pageInfo {
-  __typename: "PageInfo";
-  endCursor: string | null;
-  hasNextPage: boolean;
-  hasPreviousPage: boolean;
-  startCursor: string | null;
-}
-
-export interface CategoryProperties_category_products_edges_node_productType {
-  __typename: "ProductType";
-  id: string;
-  name: string;
-}
-
-export interface CategoryProperties_category_products_edges_node {
-  __typename: "Product";
-  id: string;
-  name: string;
-  thumbnailUrl: string | null;
-  productType: CategoryProperties_category_products_edges_node_productType;
-}
-
-export interface CategoryProperties_category_products_edges {
-  __typename: "ProductCountableEdge";
-  cursor: string;
-  node: CategoryProperties_category_products_edges_node;
-}
-
-export interface CategoryProperties_category_products {
-  __typename: "ProductCountableConnection";
-  pageInfo: CategoryProperties_category_products_pageInfo;
-  edges: CategoryProperties_category_products_edges[];
-}
-
-export interface CategoryProperties_category {
-  __typename: "Category";
-  id: string;
-  name: string;
-  description: string;
-  parent: CategoryProperties_category_parent | null;
-  children: CategoryProperties_category_children | null;
-  products: CategoryProperties_category_products | null;
-}
-
-export interface CategoryProperties {
-  category: CategoryProperties_category | null;
-}
-
-export interface CategoryPropertiesVariables {
-  id: string;
-  first?: number | null;
-  after?: string | null;
-  last?: number | null;
-  before?: string | null;
-}

src/categories/types/RootCategoryChildren.ts

@@ -1,39 +0,0 @@
-/* tslint:disable */
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL query operation: RootCategoryChildren
-// ====================================================
-
-export interface RootCategoryChildren_categories_edges_node_children {
-  __typename: "CategoryCountableConnection";
-  totalCount: number | null;
-}
-
-export interface RootCategoryChildren_categories_edges_node_products {
-  __typename: "ProductCountableConnection";
-  totalCount: number | null;
-}
-
-export interface RootCategoryChildren_categories_edges_node {
-  __typename: "Category";
-  id: string;
-  name: string;
-  children: RootCategoryChildren_categories_edges_node_children | null;
-  products: RootCategoryChildren_categories_edges_node_products | null;
-}
-
-export interface RootCategoryChildren_categories_edges {
-  __typename: "CategoryCountableEdge";
-  cursor: string;
-  node: RootCategoryChildren_categories_edges_node;
-}
-
-export interface RootCategoryChildren_categories {
-  __typename: "CategoryCountableConnection";
-  edges: RootCategoryChildren_categories_edges[];
-}
-
-export interface RootCategoryChildren {
-  categories: RootCategoryChildren_categories | null;
-}

src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx

@@ -1,6 +1,5 @@
 import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import AppHeader from "@saleor/components/AppHeader";
 import { CardSpacer } from "@saleor/components/CardSpacer";
 import CardTitle from "@saleor/components/CardTitle";
@@ -12,6 +11,7 @@ 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 { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import useDateLocalize from "@saleor/hooks/useDateLocalize";
 import { commonMessages, sectionNames } from "@saleor/intl";
 import { ContentState, convertToRaw, RawDraftContentState } from "draft-js";

src/collections/components/CollectionDetails/CollectionDetails.tsx

@@ -1,10 +1,10 @@
 import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import CardTitle from "@saleor/components/CardTitle";
 import FormSpacer from "@saleor/components/FormSpacer";
 import RichTextEditor from "@saleor/components/RichTextEditor";
+import { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { maybe } from "@saleor/misc";
 import { getFormErrors, getProductErrorMessage } from "@saleor/utils/errors";

src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx

@@ -1,4 +1,3 @@
-import { ProductErrorFragment } from "@saleor/attributes/types/ProductErrorFragment";
 import AppHeader from "@saleor/components/AppHeader";
 import { CardSpacer } from "@saleor/components/CardSpacer";
 import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
@@ -12,6 +11,7 @@ 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 { ProductErrorFragment } from "@saleor/fragments/types/ProductErrorFragment";
 import useDateLocalize from "@saleor/hooks/useDateLocalize";
 import { sectionNames } from "@saleor/intl";
 import { RawDraftContentState } from "draft-js";

src/collections/mutations.ts

@@ -1,11 +1,14 @@
-import { productErrorFragment } from "@saleor/attributes/mutations";
-import gql from "graphql-tag";
-
-import { TypedMutation } from "../mutations";
 import {
   collectionDetailsFragment,
   collectionProductFragment
-} from "./queries";
+} from "@saleor/fragments/collections";
+import {
+  productErrorFragment,
+  shopErrorFragment
+} from "@saleor/fragments/errors";
+import gql from "graphql-tag";
+
+import { TypedMutation } from "../mutations";
 import {
   CollectionAssignProduct,
   CollectionAssignProductVariables
@@ -39,13 +42,6 @@ import {
   UnassignCollectionProductVariables
 } from "./types/UnassignCollectionProduct";
 
-export const ShopErrorFragment = gql`
-  fragment ShopErrorFragment on ShopError {
-    code
-    field
-  }
-`;
-
 const collectionUpdate = gql`
   ${collectionDetailsFragment}
   ${productErrorFragment}
@@ -68,7 +64,7 @@ export const TypedCollectionUpdateMutation = TypedMutation<
 const collectionUpdateWithHomepage = gql`
   ${collectionDetailsFragment}
   ${productErrorFragment}
-  ${ShopErrorFragment}
+  ${shopErrorFragment}
   mutation CollectionUpdateWithHomepage(
     $id: ID!
     $input: CollectionInput!

src/collections/queries.ts

@@ -1,3 +1,8 @@
+import {
+  collectionDetailsFragment,
+  collectionFragment,
+  collectionProductFragment
+} from "@saleor/fragments/collections";
 import makeQuery from "@saleor/hooks/makeQuery";
 import gql from "graphql-tag";
 
@@ -11,49 +16,6 @@ import {
   CollectionListVariables
 } from "./types/CollectionList";
 
-export const collectionFragment = gql`
-  fragment CollectionFragment on Collection {
-    id
-    isPublished
-    name
-  }
-`;
-
-export const collectionDetailsFragment = gql`
-  ${collectionFragment}
-  fragment CollectionDetailsFragment on Collection {
-    ...CollectionFragment
-    backgroundImage {
-      alt
-      url
-    }
-    descriptionJson
-    publicationDate
-    seoDescription
-    seoTitle
-    isPublished
-  }
-`;
-
-// This fragment is used to make sure that product's fields that are returned
-// are always the same - fixes apollo cache
-// https://github.com/apollographql/apollo-client/issues/2496
-// https://github.com/apollographql/apollo-client/issues/3468
-export const collectionProductFragment = gql`
-  fragment CollectionProductFragment on Product {
-    id
-    isPublished
-    name
-    productType {
-      id
-      name
-    }
-    thumbnail {
-      url
-    }
-  }
-`;
-
 export const collectionList = gql`
   ${collectionFragment}
   query CollectionList(

src/collections/types/AssignHomepageCollection.ts

@@ -1,36 +0,0 @@
-/* tslint:disable */
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL mutation operation: AssignHomepageCollection
-// ====================================================
-
-export interface AssignHomepageCollection_homepageCollectionUpdate_errors {
-  __typename: "Error";
-  field: string | null;
-  message: string | null;
-}
-
-export interface AssignHomepageCollection_homepageCollectionUpdate_shop_homepageCollection {
-  __typename: "Collection";
-  id: string;
-}
-
-export interface AssignHomepageCollection_homepageCollectionUpdate_shop {
-  __typename: "Shop";
-  homepageCollection: AssignHomepageCollection_homepageCollectionUpdate_shop_homepageCollection | null;
-}
-
-export interface AssignHomepageCollection_homepageCollectionUpdate {
-  __typename: "HomepageCollectionUpdate";
-  errors: AssignHomepageCollection_homepageCollectionUpdate_errors[] | null;
-  shop: AssignHomepageCollection_homepageCollectionUpdate_shop | null;
-}
-
-export interface AssignHomepageCollection {
-  homepageCollectionUpdate: AssignHomepageCollection_homepageCollectionUpdate | null;
-}
-
-export interface AssignHomepageCollectionVariables {
-  id?: string | null;
-}

src/collections/types/SearchProducts.ts

@@ -1,44 +0,0 @@
-/* tslint:disable */
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL query operation: SearchProducts
-// ====================================================
-
-export interface SearchProducts_products_edges_node_productType {
-  __typename: "ProductType";
-  id: string;
-  name: string;
-}
-
-export interface SearchProducts_products_edges_node_thumbnail {
-  __typename: "Image";
-  url: string;
-}
-
-export interface SearchProducts_products_edges_node {
-  __typename: "Product";
-  id: string;
-  isPublished: boolean;
-  name: string;
-  productType: SearchProducts_products_edges_node_productType;
-  thumbnail: SearchProducts_products_edges_node_thumbnail | null;
-}
-
-export interface SearchProducts_products_edges {
-  __typename: "ProductCountableEdge";
-  node: SearchProducts_products_edges_node;
-}
-
-export interface SearchProducts_products {
-  __typename: "ProductCountableConnection";
-  edges: SearchProducts_products_edges[];
-}
-
-export interface SearchProducts {
-  products: SearchProducts_products | null;
-}
-
-export interface SearchProductsVariables {
-  query: string;
-}

src/components/AccountPermissionGroups/AccountPermissionGroups.stories.tsx

@@ -1,5 +1,5 @@
+import { StaffErrorFragment } from "@saleor/fragments/types/StaffErrorFragment";
 import { SearchPermissionGroups_search_edges_node } from "@saleor/searches/types/SearchPermissionGroups";
-import { StaffErrorFragment } from "@saleor/staff/types/StaffErrorFragment";
 import Decorator from "@saleor/storybook/Decorator";
 import { AccountErrorCode } from "@saleor/types/globalTypes";
 import { storiesOf } from "@storybook/react";

src/components/AccountPermissionGroups/AccountPermissionGroups.tsx

@@ -1,7 +1,7 @@
 import Typography from "@material-ui/core/Typography";
+import { StaffErrorFragment } from "@saleor/fragments/types/StaffErrorFragment";
 import { FormChange } from "@saleor/hooks/useForm";
 import { SearchPermissionGroups_search_edges_node } from "@saleor/searches/types/SearchPermissionGroups";
-import { StaffErrorFragment } from "@saleor/staff/types/StaffErrorFragment";
 import { FetchMoreProps, SearchPageProps } from "@saleor/types";
 import { getFormErrors } from "@saleor/utils/errors";
 import getStaffErrorMessage from "@saleor/utils/errors/staff";

src/components/AccountPermissions/utils.ts

@@ -1,5 +1,5 @@
-import { User_userPermissions } from "@saleor/auth/types/User";
 import { ShopInfo_shop_permissions } from "@saleor/components/Shop/types/ShopInfo";
+import { User_userPermissions } from "@saleor/fragments/types/User";
 import { PermissionGroupDetails_user_userPermissions } from "@saleor/permissionGroups/types/PermissionGroupDetails";
 
 export const getLastSourcesOfPermission = (

src/components/AddressEdit/AddressEdit.tsx

@@ -1,9 +1,9 @@
 import { makeStyles } from "@material-ui/core/styles";
 import TextField from "@material-ui/core/TextField";
 import { AddressTypeInput } from "@saleor/customers/types";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
+import { OrderErrorFragment } from "@saleor/fragments/types/OrderErrorFragment";
 import { commonMessages } from "@saleor/intl";
-import { OrderErrorFragment } from "@saleor/orders/types/OrderErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getAccountErrorMessage from "@saleor/utils/errors/account";
 import getOrderErrorMessage from "@saleor/utils/errors/order";

src/components/AppLayout/MenuList.tsx

@@ -1,6 +1,7 @@
 import configureIcon from "@assets/images/menu-configure-icon.svg";
 import { makeStyles } from "@material-ui/core/styles";
 import Typography from "@material-ui/core/Typography";
+import { User } from "@saleor/fragments/types/User";
 import useTheme from "@saleor/hooks/useTheme";
 import { sectionNames } from "@saleor/intl";
 import classNames from "classnames";
@@ -9,7 +10,6 @@ import SVG from "react-inlinesvg";
 import { FormattedMessage, useIntl } from "react-intl";
 import { matchPath } from "react-router";
 
-import { User } from "../../auth/types/User";
 import {
   configurationMenuUrl,
   createConfigurationMenu

src/components/CompanyAddressInput/CompanyAddressForm.tsx

@@ -6,14 +6,14 @@ import SingleAutocompleteSelectField, {
   SingleAutocompleteChoiceType
 } from "@saleor/components/SingleAutocompleteSelectField";
 import { AddressTypeInput } from "@saleor/customers/types";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
+import { ShopErrorFragment } from "@saleor/fragments/types/ShopErrorFragment";
+import { WarehouseErrorFragment } from "@saleor/fragments/types/WarehouseErrorFragment";
 import { ChangeEvent } from "@saleor/hooks/useForm";
-import { ShopErrorFragment } from "@saleor/siteSettings/types/ShopErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getAccountErrorMessage from "@saleor/utils/errors/account";
 import getShopErrorMessage from "@saleor/utils/errors/shop";
 import getWarehouseErrorMessage from "@saleor/utils/errors/warehouse";
-import { WarehouseErrorFragment } from "@saleor/warehouses/types/WarehouseErrorFragment";
 import React from "react";
 import { IntlShape, useIntl } from "react-intl";
 

src/components/CountryList/CountryList.tsx

@@ -11,12 +11,12 @@ import DeleteIcon from "@material-ui/icons/Delete";
 import CardTitle from "@saleor/components/CardTitle";
 import ResponsiveTable from "@saleor/components/ResponsiveTable";
 import Skeleton from "@saleor/components/Skeleton";
+import { CountryFragment } from "@saleor/fragments/types/CountryFragment";
 import classNames from "classnames";
 import React from "react";
 import { FormattedMessage } from "react-intl";
 
 import { getStringOrPlaceholder, maybe, renderCollection } from "../../misc";
-import { CountryFragment } from "../../taxes/types/CountryFragment";
 
 export interface CountryListProps {
   countries: CountryFragment[];

src/components/RequirePermissions.tsx

@@ -1,4 +1,4 @@
-import { User_userPermissions } from "@saleor/auth/types/User";
+import { User_userPermissions } from "@saleor/fragments/types/User";
 import { PermissionEnum } from "@saleor/types/globalTypes";
 import React from "react";
 

src/configuration/ConfigurationPage.tsx

@@ -3,12 +3,12 @@ import CardContent from "@material-ui/core/CardContent";
 import { IconProps } from "@material-ui/core/Icon";
 import { makeStyles } from "@material-ui/core/styles";
 import Typography from "@material-ui/core/Typography";
+import { User } from "@saleor/fragments/types/User";
 import { sectionNames } from "@saleor/intl";
 import React from "react";
 import { useIntl } from "react-intl";
 
 import { hasPermission } from "../auth/misc";
-import { User } from "../auth/types/User";
 import Container from "../components/Container";
 import PageHeader from "../components/PageHeader";
 import { PermissionEnum } from "../types/globalTypes";

src/customers/components/CustomerAddressDialog/CustomerAddressDialog.tsx

@@ -9,7 +9,7 @@ import ConfirmButton, {
   ConfirmButtonTransitionState
 } from "@saleor/components/ConfirmButton";
 import Form from "@saleor/components/Form";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import useAddressValidation from "@saleor/hooks/useAddressValidation";
 import useModalDialogErrors from "@saleor/hooks/useModalDialogErrors";
 import useStateFromProps from "@saleor/hooks/useStateFromProps";

src/customers/components/CustomerCreateAddress/CustomerCreateAddress.tsx

@@ -6,7 +6,7 @@ import AddressEdit from "@saleor/components/AddressEdit";
 import CardTitle from "@saleor/components/CardTitle";
 import { FormSpacer } from "@saleor/components/FormSpacer";
 import { SingleAutocompleteChoiceType } from "@saleor/components/SingleAutocompleteSelectField";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import React from "react";
 import { FormattedMessage, useIntl } from "react-intl";
 

src/customers/components/CustomerCreateDetails/CustomerCreateDetails.tsx

@@ -3,7 +3,7 @@ import CardContent from "@material-ui/core/CardContent";
 import { makeStyles } from "@material-ui/core/styles";
 import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getAccountErrorMessage from "@saleor/utils/errors/account";

src/customers/components/CustomerCreateNote/CustomerCreateNote.tsx

@@ -4,7 +4,7 @@ import TextField from "@material-ui/core/TextField";
 import Typography from "@material-ui/core/Typography";
 import CardTitle from "@saleor/components/CardTitle";
 import { FormSpacer } from "@saleor/components/FormSpacer";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getAccountErrorMessage from "@saleor/utils/errors/account";
 import React from "react";

src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx

@@ -6,7 +6,7 @@ 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 { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import useAddressValidation from "@saleor/hooks/useAddressValidation";
 import { sectionNames } from "@saleor/intl";
 import { AddressInput } from "@saleor/types/globalTypes";

src/customers/components/CustomerDetails/CustomerDetails.tsx

@@ -6,7 +6,7 @@ import Typography from "@material-ui/core/Typography";
 import CardTitle from "@saleor/components/CardTitle";
 import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox";
 import Skeleton from "@saleor/components/Skeleton";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import { maybe } from "@saleor/misc";
 import { getFormErrors } from "@saleor/utils/errors";
 import getAccountErrorMessage from "@saleor/utils/errors/account";

src/customers/components/CustomerDetailsPage/CustomerDetailsPage.tsx

@@ -6,7 +6,7 @@ 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 { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import React from "react";
 import { useIntl } from "react-intl";

src/customers/components/CustomerInfo/CustomerInfo.tsx

@@ -6,7 +6,7 @@ import Typography from "@material-ui/core/Typography";
 import CardTitle from "@saleor/components/CardTitle";
 import Grid from "@saleor/components/Grid";
 import Hr from "@saleor/components/Hr";
-import { AccountErrorFragment } from "@saleor/customers/types/AccountErrorFragment";
+import { AccountErrorFragment } from "@saleor/fragments/types/AccountErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getAccountErrorMessage from "@saleor/utils/errors/account";

src/customers/mutations.ts

@@ -1,8 +1,12 @@
+import { fragmentAddress } from "@saleor/fragments/address";
+import {
+  customerAddressesFragment,
+  customerDetailsFragment
+} from "@saleor/fragments/customers";
+import { accountErrorFragment } from "@saleor/fragments/errors";
 import gql from "graphql-tag";
 
 import { TypedMutation } from "../mutations";
-import { fragmentAddress } from "../orders/queries";
-import { customerAddressesFragment, customerDetailsFragment } from "./queries";
 import {
   BulkRemoveCustomers,
   BulkRemoveCustomersVariables
@@ -36,13 +40,6 @@ import {
   UpdateCustomerAddressVariables
 } from "./types/UpdateCustomerAddress";
 
-export const accountErrorFragment = gql`
-  fragment AccountErrorFragment on AccountError {
-    code
-    field
-  }
-`;
-
 const updateCustomer = gql`
   ${accountErrorFragment}
   ${customerDetailsFragment}

src/customers/queries.ts

@@ -1,7 +1,11 @@
+import {
+  customerAddressesFragment,
+  customerDetailsFragment,
+  customerFragment
+} from "@saleor/fragments/customers";
 import makeQuery from "@saleor/hooks/makeQuery";
 import gql from "graphql-tag";
 
-import { fragmentAddress } from "../orders/queries";
 import { TypedQuery } from "../queries";
 import {
   CustomerAddresses,
@@ -14,50 +18,6 @@ import {
 } from "./types/CustomerDetails";
 import { ListCustomers, ListCustomersVariables } from "./types/ListCustomers";
 
-export const customerFragment = gql`
-  fragment CustomerFragment on User {
-    id
-    email
-    firstName
-    lastName
-  }
-`;
-
-export const customerDetailsFragment = gql`
-  ${customerFragment}
-  ${fragmentAddress}
-  fragment CustomerDetailsFragment on User {
-    ...CustomerFragment
-    dateJoined
-    lastLogin
-    defaultShippingAddress {
-      ...AddressFragment
-    }
-    defaultBillingAddress {
-      ...AddressFragment
-    }
-    note
-    isActive
-  }
-`;
-
-export const customerAddressesFragment = gql`
-  ${customerFragment}
-  ${fragmentAddress}
-  fragment CustomerAddressesFragment on User {
-    ...CustomerFragment
-    addresses {
-      ...AddressFragment
-    }
-    defaultBillingAddress {
-      id
-    }
-    defaultShippingAddress {
-      id
-    }
-  }
-`;
-
 const customerList = gql`
   ${customerFragment}
   query ListCustomers(

src/discounts/components/DiscountDates/DiscountDates.tsx

@@ -4,7 +4,7 @@ import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
 import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox";
 import Grid from "@saleor/components/Grid";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";

src/discounts/components/SaleCreatePage/SaleCreatePage.tsx

@@ -6,7 +6,7 @@ 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 { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import React from "react";
 import { useIntl } from "react-intl";

src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx

@@ -7,7 +7,7 @@ import Grid from "@saleor/components/Grid";
 import PageHeader from "@saleor/components/PageHeader";
 import SaveButtonBar from "@saleor/components/SaveButtonBar";
 import { Tab, TabContainer } from "@saleor/components/Tab";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import React from "react";
 import { useIntl } from "react-intl";

src/discounts/components/SaleInfo/SaleInfo.tsx

@@ -2,7 +2,7 @@ import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";

src/discounts/components/SaleValue/SaleValue.tsx

@@ -2,7 +2,7 @@ import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { FormChange } from "@saleor/hooks/useForm";
 import { SaleType } from "@saleor/types/globalTypes";
 import { getFormErrors } from "@saleor/utils/errors";

src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx

@@ -6,7 +6,7 @@ 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 { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import React from "react";
 import { useIntl } from "react-intl";

src/discounts/components/VoucherDates/VoucherDates.tsx

@@ -4,7 +4,7 @@ import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
 import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox";
 import Grid from "@saleor/components/Grid";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";

src/discounts/components/VoucherDetailsPage/VoucherDetailsPage.tsx

@@ -10,7 +10,7 @@ import PageHeader from "@saleor/components/PageHeader";
 import SaveButtonBar from "@saleor/components/SaveButtonBar";
 import { Tab, TabContainer } from "@saleor/components/Tab";
 import { RequirementsPicker } from "@saleor/discounts/types";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { sectionNames } from "@saleor/intl";
 import React from "react";
 import { FormattedMessage, useIntl } from "react-intl";

src/discounts/components/VoucherInfo/VoucherInfo.tsx

@@ -3,7 +3,7 @@ import Card from "@material-ui/core/Card";
 import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";

src/discounts/components/VoucherLimits/VoucherLimits.tsx

@@ -3,7 +3,7 @@ import CardContent from "@material-ui/core/CardContent";
 import TextField from "@material-ui/core/TextField";
 import CardTitle from "@saleor/components/CardTitle";
 import { ControlledCheckbox } from "@saleor/components/ControlledCheckbox";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";
 import React from "react";

src/discounts/components/VoucherRequirements/VoucherRequirements.tsx

@@ -5,7 +5,7 @@ import CardTitle from "@saleor/components/CardTitle";
 import { FormSpacer } from "@saleor/components/FormSpacer";
 import RadioGroupField from "@saleor/components/RadioGroupField";
 import { RequirementsPicker } from "@saleor/discounts/types";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";
 import React from "react";

src/discounts/components/VoucherTypes/VoucherTypes.tsx

@@ -3,7 +3,7 @@ import CardContent from "@material-ui/core/CardContent";
 import CardTitle from "@saleor/components/CardTitle";
 import Grid from "@saleor/components/Grid";
 import RadioGroupField from "@saleor/components/RadioGroupField";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";
 import React from "react";

src/discounts/components/VoucherValue/VoucherValue.tsx

@@ -8,7 +8,7 @@ import { FormSpacer } from "@saleor/components/FormSpacer";
 import Hr from "@saleor/components/Hr";
 import RadioGroupField from "@saleor/components/RadioGroupField";
 import TextFieldWithChoice from "@saleor/components/TextFieldWithChoice";
-import { DiscountErrorFragment } from "@saleor/discounts/types/DiscountErrorFragment";
+import { DiscountErrorFragment } from "@saleor/fragments/types/DiscountErrorFragment";
 import { getFormErrors } from "@saleor/utils/errors";
 import getDiscountErrorMessage from "@saleor/utils/errors/discounts";
 import React from "react";

src/discounts/mutations.ts

@@ -1,12 +1,13 @@
-import gql from "graphql-tag";
-
-import { TypedMutation } from "../mutations";
 import {
   saleDetailsFragment,
   saleFragment,
   voucherDetailsFragment,
   voucherFragment
-} from "./queries";
+} from "@saleor/fragments/discounts";
+import { discountErrorFragment } from "@saleor/fragments/errors";
+import gql from "graphql-tag";
+
+import { TypedMutation } from "../mutations";
 import {
   SaleBulkDelete,
   SaleBulkDeleteVariables
@@ -38,13 +39,6 @@ import { VoucherCreate, VoucherCreateVariables } from "./types/VoucherCreate";
 import { VoucherDelete, VoucherDeleteVariables } from "./types/VoucherDelete";
 import { VoucherUpdate, VoucherUpdateVariables } from "./types/VoucherUpdate";
 
-const discountErrorFragment = gql`
-  fragment DiscountErrorFragment on DiscountError {
-    code
-    field
-  }
-`;
-
 const saleUpdate = gql`
   ${discountErrorFragment}
   ${saleFragment}

src/discounts/queries.ts

@@ -1,7 +1,14 @@
+import {
+  saleDetailsFragment,
+  saleFragment,
+  voucherDetailsFragment,
+  voucherFragment
+} from "@saleor/fragments/discounts";
+import { pageInfoFragment } from "@saleor/fragments/pageInfo";
 import makeQuery from "@saleor/hooks/makeQuery";
 import gql from "graphql-tag";
 
-import { pageInfoFragment, TypedQuery } from "../queries";
+import { TypedQuery } from "../queries";
 import { SaleDetails, SaleDetailsVariables } from "./types/SaleDetails";
 import { SaleList, SaleListVariables } from "./types/SaleList";
 import {
@@ -10,160 +17,6 @@ import {
 } from "./types/VoucherDetails";
 import { VoucherList, VoucherListVariables } from "./types/VoucherList";
 
-export const saleFragment = gql`
-  fragment SaleFragment on Sale {
-    id
-    name
-    type
-    startDate
-    endDate
-    value
-  }
-`;
-
-export const saleDetailsFragment = gql`
-  ${pageInfoFragment}
-  ${saleFragment}
-  fragment SaleDetailsFragment on Sale {
-    ...SaleFragment
-    products(after: $after, before: $before, first: $first, last: $last) {
-      edges {
-        node {
-          id
-          name
-          isPublished
-          productType {
-            id
-            name
-          }
-          thumbnail {
-            url
-          }
-        }
-      }
-      pageInfo {
-        ...PageInfoFragment
-      }
-      totalCount
-    }
-    categories(after: $after, before: $before, first: $first, last: $last) {
-      edges {
-        node {
-          id
-          name
-          products {
-            totalCount
-          }
-        }
-      }
-      pageInfo {
-        ...PageInfoFragment
-      }
-      totalCount
-    }
-    collections(after: $after, before: $before, first: $first, last: $last) {
-      edges {
-        node {
-          id
-          name
-          products {
-            totalCount
-          }
-        }
-      }
-      pageInfo {
-        ...PageInfoFragment
-      }
-      totalCount
-    }
-  }
-`;
-
-export const voucherFragment = gql`
-  fragment VoucherFragment on Voucher {
-    id
-    code
-    startDate
-    endDate
-    usageLimit
-    discountValueType
-    discountValue
-    countries {
-      code
-      country
-    }
-    minSpent {
-      currency
-      amount
-    }
-    minCheckoutItemsQuantity
-  }
-`;
-
-export const voucherDetailsFragment = gql`
-  ${pageInfoFragment}
-  ${voucherFragment}
-  fragment VoucherDetailsFragment on Voucher {
-    ...VoucherFragment
-    type
-    code
-    usageLimit
-    used
-    applyOncePerOrder
-    applyOncePerCustomer
-    products(after: $after, before: $before, first: $first, last: $last) {
-      edges {
-        node {
-          id
-          name
-          productType {
-            id
-            name
-          }
-          isPublished
-          thumbnail {
-            url
-          }
-        }
-      }
-      totalCount
-      pageInfo {
-        ...PageInfoFragment
-      }
-    }
-    collections(after: $after, before: $before, first: $first, last: $last) {
-      edges {
-        node {
-          id
-          name
-          products {
-            totalCount
-          }
-        }
-      }
-      totalCount
-      pageInfo {
-        ...PageInfoFragment
-      }
-    }
-    categories(after: $after, before: $before, first: $first, last: $last) {
-      edges {
-        node {
-          id
-          name
-          products {
-            totalCount
-          }
-        }
-      }
-      totalCount
-      pageInfo {
-        ...PageInfoFragment
-      }
-    }
-  }
-`;
-
 export const saleList = gql`
   ${pageInfoFragment}
   ${saleFragment}

src/fixtures.ts

@@ -1,5 +1,5 @@
-import { User_userPermissions } from "./auth/types/User";
 import { ShopInfo_shop_permissions } from "./components/Shop/types/ShopInfo";
+import { User_userPermissions } from "./fragments/types/User";
 import {
   FetchMoreProps,
   FilterPageProps,

src/fragments/address.ts

@@ -0,0 +1,22 @@
+import gql from "graphql-tag";
+
+export const fragmentAddress = gql`
+  fragment AddressFragment on Address {
+    city
+    cityArea
+    companyName
+    country {
+      __typename
+      code
+      country
+    }
+    countryArea
+    firstName
+    id
+    lastName
+    phone
+    postalCode
+    streetAddress1
+    streetAddress2
+  }
+`;

src/fragments/attributes.ts

@@ -0,0 +1,29 @@
+import gql from "graphql-tag";
+
+export const attributeFragment = gql`
+  fragment AttributeFragment on Attribute {
+    id
+    name
+    slug
+    visibleInStorefront
+    filterableInDashboard
+    filterableInStorefront
+  }
+`;
+
+export const attributeDetailsFragment = gql`
+  ${attributeFragment}
+  fragment AttributeDetailsFragment on Attribute {
+    ...AttributeFragment
+    availableInGrid
+    inputType
+    storefrontSearchPosition
+    valueRequired
+    values {
+      id
+      name
+      slug
+      type
+    }
+  }
+`;

src/fragments/auth.ts

@@ -0,0 +1,17 @@
+import gql from "graphql-tag";
+
+export const fragmentUser = gql`
+  fragment User on User {
+    id
+    email
+    firstName
+    lastName
+    userPermissions {
+      code
+      name
+    }
+    avatar {
+      url
+    }
+  }
+`;

src/fragments/categories.ts

@@ -0,0 +1,30 @@
+import gql from "graphql-tag";
+
+export const categoryFragment = gql`
+  fragment CategoryFragment on Category {
+    id
+    name
+    children {
+      totalCount
+    }
+    products {
+      totalCount
+    }
+  }
+`;
+export const categoryDetailsFragment = gql`
+  fragment CategoryDetailsFragment on Category {
+    id
+    backgroundImage {
+      alt
+      url
+    }
+    name
+    descriptionJson
+    seoDescription
+    seoTitle
+    parent {
+      id
+    }
+  }
+`;

src/fragments/collections.ts

@@ -0,0 +1,44 @@
+import gql from "graphql-tag";
+
+export const collectionFragment = gql`
+  fragment CollectionFragment on Collection {
+    id
+    isPublished
+    name
+  }
+`;
+
+export const collectionDetailsFragment = gql`
+  ${collectionFragment}
+  fragment CollectionDetailsFragment on Collection {
+    ...CollectionFragment
+    backgroundImage {
+      alt
+      url
+    }
+    descriptionJson
+    publicationDate
+    seoDescription
+    seoTitle
+    isPublished
+  }
+`;
+
+// This fragment is used to make sure that product's fields that are returned
+// are always the same - fixes apollo cache
+// https://github.com/apollographql/apollo-client/issues/2496
+// https://github.com/apollographql/apollo-client/issues/3468
+export const collectionProductFragment = gql`
+  fragment CollectionProductFragment on Product {
+    id
+    isPublished
+    name
+    productType {
+      id
+      name
+    }
+    thumbnail {
+      url
+    }
+  }
+`;

src/fragments/customers.ts

@@ -0,0 +1,47 @@
+import gql from "graphql-tag";
+
+import { fragmentAddress } from "./address";
+
+export const customerFragment = gql`
+  fragment CustomerFragment on User {
+    id
+    email
+    firstName
+    lastName
+  }
+`;
+
+export const customerDetailsFragment = gql`
+  ${customerFragment}
+  ${fragmentAddress}
+  fragment CustomerDetailsFragment on User {
+    ...CustomerFragment
+    dateJoined
+    lastLogin
+    defaultShippingAddress {
+      ...AddressFragment
+    }
+    defaultBillingAddress {
+      ...AddressFragment
+    }
+    note
+    isActive
+  }
+`;
+
+export const customerAddressesFragment = gql`
+  ${customerFragment}
+  ${fragmentAddress}
+  fragment CustomerAddressesFragment on User {
+    ...CustomerFragment
+    addresses {
+      ...AddressFragment
+    }
+    defaultBillingAddress {
+      id
+    }
+    defaultShippingAddress {
+      id
+    }
+  }
+`;

src/fragments/discounts.ts

@@ -0,0 +1,157 @@
+import gql from "graphql-tag";
+
+import { pageInfoFragment } from "./pageInfo";
+
+export const saleFragment = gql`
+  fragment SaleFragment on Sale {
+    id
+    name
+    type
+    startDate
+    endDate
+    value
+  }
+`;
+
+export const saleDetailsFragment = gql`
+  ${pageInfoFragment}
+  ${saleFragment}
+  fragment SaleDetailsFragment on Sale {
+    ...SaleFragment
+    products(after: $after, before: $before, first: $first, last: $last) {
+      edges {
+        node {
+          id
+          name
+          isPublished
+          productType {
+            id
+            name
+          }
+          thumbnail {
+            url
+          }
+        }
+      }
+      pageInfo {
+        ...PageInfoFragment
+      }
+      totalCount
+    }
+    categories(after: $after, before: $before, first: $first, last: $last) {
+      edges {
+        node {
+          id
+          name
+          products {
+            totalCount
+          }
+        }
+      }
+      pageInfo {
+        ...PageInfoFragment
+      }
+      totalCount
+    }
+    collections(after: $after, before: $before, first: $first, last: $last) {
+      edges {
+        node {
+          id
+          name
+          products {
+            totalCount
+          }
+        }
+      }
+      pageInfo {
+        ...PageInfoFragment
+      }
+      totalCount
+    }
+  }
+`;
+
+export const voucherFragment = gql`
+  fragment VoucherFragment on Voucher {
+    id
+    code
+    startDate
+    endDate
+    usageLimit
+    discountValueType
+    discountValue
+    countries {
+      code
+      country
+    }
+    minSpent {
+      currency
+      amount
+    }
+    minCheckoutItemsQuantity
+  }
+`;
+
+export const voucherDetailsFragment = gql`
+  ${pageInfoFragment}
+  ${voucherFragment}
+  fragment VoucherDetailsFragment on Voucher {
+    ...VoucherFragment
+    type
+    code
+    usageLimit
+    used
+    applyOncePerOrder
+    applyOncePerCustomer
+    products(after: $after, before: $before, first: $first, last: $last) {
+      edges {
+        node {
+          id
+          name
+          productType {
+            id
+            name
+          }
+          isPublished
+          thumbnail {
+            url
+          }
+        }
+      }
+      totalCount
+      pageInfo {
+        ...PageInfoFragment
+      }
+    }
+    collections(after: $after, before: $before, first: $first, last: $last) {
+      edges {
+        node {
+          id
+          name
+          products {
+            totalCount
+          }
+        }
+      }
+      totalCount
+      pageInfo {
+        ...PageInfoFragment
+      }
+    }
+    categories(after: $after, before: $before, first: $first, last: $last) {
+      edges {
+        node {
+          id
+          name
+          products {
+            totalCount
+          }
+        }
+      }
+      totalCount
+      pageInfo {
+        ...PageInfoFragment
+      }
+    }
+  }
+`;

src/fragments/errors.ts

@@ -0,0 +1,106 @@
+import gql from "graphql-tag";
+
+export const productErrorFragment = gql`
+  fragment ProductErrorFragment on ProductError {
+    code
+    field
+  }
+`;
+
+export const accountErrorFragment = gql`
+  fragment AccountErrorFragment on AccountError {
+    code
+    field
+  }
+`;
+
+export const discountErrorFragment = gql`
+  fragment DiscountErrorFragment on DiscountError {
+    code
+    field
+  }
+`;
+
+export const menuErrorFragment = gql`
+  fragment MenuErrorFragment on MenuError {
+    code
+    field
+  }
+`;
+
+export const orderErrorFragment = gql`
+  fragment OrderErrorFragment on OrderError {
+    code
+    field
+  }
+`;
+
+export const pageErrorFragment = gql`
+  fragment PageErrorFragment on PageError {
+    code
+    field
+  }
+`;
+
+export const permissionGroupErrorFragment = gql`
+  fragment PermissionGroupErrorFragment on PermissionGroupError {
+    code
+    field
+  }
+`;
+
+export const bulkProductErrorFragment = gql`
+  fragment BulkProductErrorFragment on BulkProductError {
+    field
+    code
+    index
+  }
+`;
+export const bulkStockErrorFragment = gql`
+  fragment BulkStockErrorFragment on BulkStockError {
+    code
+    field
+    index
+  }
+`;
+export const stockErrorFragment = gql`
+  fragment StockErrorFragment on StockError {
+    code
+    field
+  }
+`;
+
+export const shippingErrorFragment = gql`
+  fragment ShippingErrorFragment on ShippingError {
+    code
+    field
+  }
+`;
+
+export const shopErrorFragment = gql`
+  fragment ShopErrorFragment on ShopError {
+    code
+    field
+  }
+`;
+
+export const staffErrorFragment = gql`
+  fragment StaffErrorFragment on StaffError {
+    code
+    field
+  }
+`;
+
+export const warehouseErrorFragment = gql`
+  fragment WarehouseErrorFragment on WarehouseError {
+    code
+    field
+  }
+`;
+
+export const webhookErrorFragment = gql`
+  fragment WebhookErrorFragment on WebhookError {
+    code
+    field
+  }
+`;

src/fragments/navigation.ts

@@ -0,0 +1,69 @@
+import gql from "graphql-tag";
+
+export const menuFragment = gql`
+  fragment MenuFragment on Menu {
+    id
+    name
+    items {
+      id
+    }
+  }
+`;
+
+export const menuItemFragment = gql`
+  fragment MenuItemFragment on MenuItem {
+    category {
+      id
+      name
+    }
+    collection {
+      id
+      name
+    }
+    id
+    level
+    name
+    page {
+      id
+      title
+    }
+    url
+  }
+`;
+
+// GraphQL does not support recurive fragments
+export const menuItemNestedFragment = gql`
+  ${menuItemFragment}
+  fragment MenuItemNestedFragment on MenuItem {
+    ...MenuItemFragment
+    children {
+      ...MenuItemFragment
+      children {
+        ...MenuItemFragment
+        children {
+          ...MenuItemFragment
+          children {
+            ...MenuItemFragment
+            children {
+              ...MenuItemFragment
+              children {
+                ...MenuItemFragment
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+
+export const menuDetailsFragment = gql`
+  ${menuItemNestedFragment}
+  fragment MenuDetailsFragment on Menu {
+    id
+    items {
+      ...MenuItemNestedFragment
+    }
+    name
+  }
+`;

src/fragments/orders.ts

@@ -0,0 +1,147 @@
+import gql from "graphql-tag";
+
+import { fragmentAddress } from "./address";
+
+export const fragmentOrderEvent = gql`
+  fragment OrderEventFragment on OrderEvent {
+    id
+    amount
+    date
+    email
+    emailType
+    message
+    quantity
+    type
+    user {
+      id
+      email
+    }
+  }
+`;
+
+export const fragmentOrderLine = gql`
+  fragment OrderLineFragment on OrderLine {
+    id
+    isShippingRequired
+    productName
+    productSku
+    quantity
+    quantityFulfilled
+    unitPrice {
+      gross {
+        amount
+        currency
+      }
+      net {
+        amount
+        currency
+      }
+    }
+    thumbnail {
+      url
+    }
+  }
+`;
+export const fulfillmentFragment = gql`
+  ${fragmentOrderLine}
+  fragment FulfillmentFragment on Fulfillment {
+    id
+    lines {
+      id
+      quantity
+      orderLine {
+        ...OrderLineFragment
+      }
+    }
+    fulfillmentOrder
+    status
+    trackingNumber
+    warehouse {
+      id
+      name
+    }
+  }
+`;
+
+export const fragmentOrderDetails = gql`
+  ${fragmentAddress}
+  ${fragmentOrderEvent}
+  ${fragmentOrderLine}
+  ${fulfillmentFragment}
+  fragment OrderDetailsFragment on Order {
+    id
+    billingAddress {
+      ...AddressFragment
+    }
+    canFinalize
+    created
+    customerNote
+    events {
+      ...OrderEventFragment
+    }
+    fulfillments {
+      ...FulfillmentFragment
+    }
+    lines {
+      ...OrderLineFragment
+    }
+    number
+    paymentStatus
+    shippingAddress {
+      ...AddressFragment
+    }
+    shippingMethod {
+      id
+    }
+    shippingMethodName
+    shippingPrice {
+      gross {
+        amount
+        currency
+      }
+    }
+    status
+    subtotal {
+      gross {
+        amount
+        currency
+      }
+    }
+    total {
+      gross {
+        amount
+        currency
+      }
+      tax {
+        amount
+        currency
+      }
+    }
+    actions
+    totalAuthorized {
+      amount
+      currency
+    }
+    totalCaptured {
+      amount
+      currency
+    }
+    user {
+      id
+      email
+    }
+    userEmail
+    availableShippingMethods {
+      id
+      name
+      price {
+        amount
+        currency
+      }
+    }
+    discount {
+      amount
+      currency
+    }
+  }
+`;

src/fragments/pageInfo.ts

@@ -0,0 +1,10 @@
+import gql from "graphql-tag";
+
+export const pageInfoFragment = gql`
+  fragment PageInfoFragment on PageInfo {
+    endCursor
+    hasNextPage
+    hasPreviousPage
+    startCursor
+  }
+`;

src/fragments/pages.ts

@@ -0,0 +1,21 @@
+import gql from "graphql-tag";
+
+export const pageFragment = gql`
+  fragment PageFragment on Page {
+    id
+    title
+    slug
+    isPublished
+  }
+`;
+
+export const pageDetailsFragment = gql`
+  ${pageFragment}
+  fragment PageDetailsFragment on Page {
+    ...PageFragment
+    contentJson
+    seoTitle
+    seoDescription
+    publicationDate
+  }
+`;

src/fragments/permissionGroups.ts

@@ -0,0 +1,38 @@
+import gql from "graphql-tag";
+
+import { staffMemberFragment } from "./staff";
+
+export const permissionGroupFragment = gql`
+  fragment PermissionGroupFragment on Group {
+    id
+    name
+    userCanManage
+    users {
+      id
+      firstName
+      lastName
+    }
+  }
+`;
+
+export const permissionFragment = gql`
+  fragment PermissionFragment on Permission {
+    code
+    name
+  }
+`;
+
+export const permissionGroupDetailsFragment = gql`
+  ${permissionGroupFragment}
+  ${permissionFragment}
+  ${staffMemberFragment}
+  fragment PermissionGroupDetailsFragment on Group {
+    ...PermissionGroupFragment
+    permissions {
+      ...PermissionFragment
+    }
+    users {
+      ...StaffMemberFragment
+    }
+  }
+`;

src/fragments/plugins.ts

@@ -0,0 +1,24 @@
+import gql from "graphql-tag";
+
+export const pluginsFragment = gql`
+  fragment PluginFragment on Plugin {
+    id
+    name
+    description
+    active
+  }
+`;
+
+export const pluginsDetailsFragment = gql`
+  ${pluginsFragment}
+  fragment PluginsDetailsFragment on Plugin {
+    ...PluginFragment
+    configuration {
+      name
+      type
+      value
+      helpText
+      label
+    }
+  }
+`;

src/fragments/productTypes.ts

@@ -0,0 +1,34 @@
+import gql from "graphql-tag";
+
+import { attributeFragment } from "./attributes";
+
+export const productTypeFragment = gql`
+  fragment ProductTypeFragment on ProductType {
+    id
+    name
+    hasVariants
+    isShippingRequired
+    taxType {
+      description
+      taxCode
+    }
+  }
+`;
+
+export const productTypeDetailsFragment = gql`
+  ${attributeFragment}
+  ${productTypeFragment}
+  fragment ProductTypeDetailsFragment on ProductType {
+    ...ProductTypeFragment
+    productAttributes {
+      ...AttributeFragment
+    }
+    variantAttributes {
+      ...AttributeFragment
+    }
+    weight {
+      unit
+      value
+    }
+  }
+`;

src/fragments/products.ts

@@ -0,0 +1,233 @@
+import gql from "graphql-tag";
+
+export const stockFragment = gql`
+  fragment StockFragment on Stock {
+    id
+    quantity
+    quantityAllocated
+    warehouse {
+      id
+      name
+    }
+  }
+`;
+
+export const fragmentMoney = gql`
+  fragment Money on Money {
+    amount
+    currency
+  }
+`;
+
+export const fragmentProductImage = gql`
+  fragment ProductImageFragment on ProductImage {
+    id
+    alt
+    sortOrder
+    url
+  }
+`;
+
+export const productFragment = gql`
+  fragment ProductFragment on Product {
+    id
+    name
+    thumbnail {
+      url
+    }
+    isAvailable
+    isPublished
+    productType {
+      id
+      name
+      hasVariants
+    }
+  }
+`;
+
+export const productVariantAttributesFragment = gql`
+  ${fragmentMoney}
+  fragment ProductVariantAttributesFragment on Product {
+    id
+    attributes {
+      attribute {
+        id
+        slug
+        name
+        inputType
+        valueRequired
+        values {
+          id
+          name
+          slug
+        }
+      }
+      values {
+        id
+        name
+        slug
+      }
+    }
+    productType {
+      id
+      variantAttributes {
+        id
+        name
+        values {
+          id
+          name
+          slug
+        }
+      }
+    }
+    pricing {
+      priceRangeUndiscounted {
+        start {
+          gross {
+            ...Money
+          }
+        }
+        stop {
+          gross {
+            ...Money
+          }
+        }
+      }
+    }
+  }
+`;
+
+export const productFragmentDetails = gql`
+  ${fragmentProductImage}
+  ${fragmentMoney}
+  ${productVariantAttributesFragment}
+  ${stockFragment}
+  fragment Product on Product {
+    ...ProductVariantAttributesFragment
+    name
+    descriptionJson
+    seoTitle
+    seoDescription
+    category {
+      id
+      name
+    }
+    collections {
+      id
+      name
+    }
+    margin {
+      start
+      stop
+    }
+    purchaseCost {
+      start {
+        ...Money
+      }
+      stop {
+        ...Money
+      }
+    }
+    isAvailable
+    isPublished
+    chargeTaxes
+    publicationDate
+    pricing {
+      priceRangeUndiscounted {
+        start {
+          gross {
+            ...Money
+          }
+        }
+        stop {
+          gross {
+            ...Money
+          }
+        }
+      }
+    }
+    images {
+      ...ProductImageFragment
+    }
+    variants {
+      id
+      sku
+      name
+      price {
+        ...Money
+      }
+      margin
+      stocks {
+        ...StockFragment
+      }
+      trackInventory
+    }
+    productType {
+      id
+      name
+      hasVariants
+    }
+  }
+`;
+
+export const fragmentVariant = gql`
+  ${fragmentMoney}
+  ${fragmentProductImage}
+  ${stockFragment}
+  fragment ProductVariant on ProductVariant {
+    id
+    attributes {
+      attribute {
+        id
+        name
+        slug
+        valueRequired
+        values {
+          id
+          name
+          slug
+        }
+      }
+      values {
+        id
+        name
+        slug
+      }
+    }
+    costPrice {
+      ...Money
+    }
+    images {
+      id
+      url
+    }
+    name
+    price {
+      ...Money
+    }
+    product {
+      id
+      images {
+        ...ProductImageFragment
+      }
+      name
+      thumbnail {
+        url
+      }
+      variants {
+        id
+        name
+        sku
+        images {
+          id
+          url
+        }
+      }
+    }
+    sku
+    stocks {
+      ...StockFragment
+    }
+    trackInventory
+  }
+`;

src/fragments/services.ts

@@ -0,0 +1,25 @@
+import gql from "graphql-tag";
+
+export const serviceFragment = gql`
+  fragment ServiceFragment on ServiceAccount {
+    id
+    name
+    isActive
+  }
+`;
+
+export const serviceDetailsFragment = gql`
+  ${serviceFragment}
+  fragment ServiceDetailsFragment on ServiceAccount {
+    ...ServiceFragment
+    permissions {
+      code
+      name
+    }
+    tokens {
+      id
+      name
+      authToken
+    }
+  }
+`;

src/fragments/shipping.ts

@@ -0,0 +1,54 @@
+import gql from "graphql-tag";
+
+export const shippingZoneFragment = gql`
+  fragment ShippingZoneFragment on ShippingZone {
+    id
+    countries {
+      code
+      country
+    }
+    name
+  }
+`;
+export const shippingMethodFragment = gql`
+  fragment ShippingMethodFragment on ShippingMethod {
+    id
+    minimumOrderPrice {
+      amount
+      currency
+    }
+    minimumOrderWeight {
+      unit
+      value
+    }
+    maximumOrderPrice {
+      amount
+      currency
+    }
+    maximumOrderWeight {
+      unit
+      value
+    }
+    name
+    price {
+      amount
+      currency
+    }
+    type
+  }
+`;
+export const shippingZoneDetailsFragment = gql`
+  ${shippingZoneFragment}
+  ${shippingMethodFragment}
+  fragment ShippingZoneDetailsFragment on ShippingZone {
+    ...ShippingZoneFragment
+    default
+    shippingMethods {
+      ...ShippingMethodFragment
+    }
+    warehouses {
+      id
+      name
+    }
+  }
+`;

src/fragments/shop.ts

@@ -0,0 +1,28 @@
+import gql from "graphql-tag";
+
+import { fragmentAddress } from "./address";
+
+export const shopFragment = gql`
+  ${fragmentAddress}
+  fragment ShopFragment on Shop {
+    authorizationKeys {
+      key
+      name
+    }
+    companyAddress {
+      ...AddressFragment
+    }
+    countries {
+      code
+      country
+    }
+    customerSetPasswordUrl
+    defaultMailSenderAddress
+    defaultMailSenderName
+    description
+    domain {
+      host
+    }
+    name
+  }
+`;

src/fragments/staff.ts

@@ -0,0 +1,29 @@
+import gql from "graphql-tag";
+
+export const staffMemberFragment = gql`
+  fragment StaffMemberFragment on User {
+    id
+    email
+    firstName
+    isActive
+    lastName
+    avatar {
+      url
+    }
+  }
+`;
+export const staffMemberDetailsFragment = gql`
+  ${staffMemberFragment}
+  fragment StaffMemberDetailsFragment on User {
+    ...StaffMemberFragment
+    permissionGroups {
+      id
+      name
+      userCanManage
+    }
+    userPermissions {
+      code
+      name
+    }
+  }
+`;

src/fragments/taxes.ts

@@ -0,0 +1,28 @@
+import gql from "graphql-tag";
+
+export const countryFragment = gql`
+  fragment CountryFragment on CountryDisplay {
+    country
+    code
+  }
+`;
+export const countryWithTaxesFragment = gql`
+  ${countryFragment}
+  fragment CountryWithTaxesFragment on CountryDisplay {
+    ...CountryFragment
+    vat {
+      standardRate
+      reducedRates {
+        rateType
+        rate
+      }
+    }
+  }
+`;
+export const shopTaxesFragment = gql`
+  fragment ShopTaxesFragment on Shop {
+    chargeTaxesOnShipping
+    includeTaxesInPrices
+    displayGrossPrices
+  }
+`;

src/fragments/translations.ts

@@ -0,0 +1,172 @@
+import gql from "graphql-tag";
+
+export const categoryTranslationFragment = gql`
+  fragment CategoryTranslationFragment on Category {
+    id
+    name
+    descriptionJson
+    seoDescription
+    seoTitle
+    translation(languageCode: $language) {
+      id
+      descriptionJson
+      language {
+        language
+      }
+      name
+      seoDescription
+      seoTitle
+    }
+  }
+`;
+export const collectionTranslationFragment = gql`
+  fragment CollectionTranslationFragment on Collection {
+    id
+    name
+    descriptionJson
+    seoDescription
+    seoTitle
+    translation(languageCode: $language) {
+      id
+      descriptionJson
+      language {
+        language
+      }
+      name
+      seoDescription
+      seoTitle
+    }
+  }
+`;
+export const productTranslationFragment = gql`
+  fragment ProductTranslationFragment on Product {
+    id
+    name
+    descriptionJson
+    seoDescription
+    seoTitle
+    translation(languageCode: $language) {
+      id
+      descriptionJson
+      language {
+        code
+        language
+      }
+      name
+      seoDescription
+      seoTitle
+    }
+  }
+`;
+export const saleTranslationFragment = gql`
+  fragment SaleTranslationFragment on Sale {
+    id
+    name
+    translation(languageCode: $language) {
+      id
+      language {
+        code
+        language
+      }
+      name
+    }
+  }
+`;
+export const voucherTranslationFragment = gql`
+  fragment VoucherTranslationFragment on Voucher {
+    id
+    name
+    translation(languageCode: $language) {
+      id
+      language {
+        code
+        language
+      }
+      name
+    }
+  }
+`;
+export const shippingMethodTranslationFragment = gql`
+  fragment ShippingMethodTranslationFragment on ShippingMethod {
+    id
+    name
+    translation(languageCode: $language) {
+      id
+      language {
+        code
+        language
+      }
+      name
+    }
+  }
+`;
+export const pageTranslationFragment = gql`
+  fragment PageTranslationFragment on Page {
+    id
+    contentJson
+    seoDescription
+    seoTitle
+    title
+
+    translation(languageCode: $language) {
+      id
+      contentJson
+      seoDescription
+      seoTitle
+      title
+      language {
+        code
+        language
+      }
+    }
+  }
+`;
+export const pageTranslatableFragment = gql`
+  fragment PageTranslatableFragment on PageTranslatableContent {
+    id
+    contentJson
+    seoDescription
+    seoTitle
+    title
+
+    translation(languageCode: $language) {
+      id
+      contentJson
+      seoDescription
+      seoTitle
+      title
+      language {
+        code
+        language
+      }
+    }
+  }
+`;
+export const productTypeTranslationFragment = gql`
+  fragment AttributeTranslationFragment on Attribute {
+    id
+    name
+    translation(languageCode: $language) {
+      id
+      name
+    }
+    values {
+      id
+      name
+      translation(languageCode: $language) {
+        id
+        name
+      }
+    }
+  }
+  fragment ProductTypeTranslationFragment on ProductType {
+    id
+    name
+    productAttributes {
+      ...AttributeTranslationFragment
+    }
+    variantAttributes {
+      ...AttributeTranslationFragment
+    }
+  }
+`;