saleor-dashboard/src/products/queries.ts
Dawid Tarasiuk 1e140853ec
File attributes (#884)
* Update changelog with file attributes

* Add file type attribute

* Update attribute properties form

* Update translation messages with file upload

* Create generic attributes component (#832)

* Create generic Attributes component

* Add story for Attributes component

* Remove deprecated attribute value type field from queries

* Update test snapshots of attributes component

* Add file upload field to atributes (#888)

* Add story for Attributes component

* Update test snapshots of attributes component

* Create file upload field in attributes

* Update upload file input data-test

* Update storybook test snapshots of attributes

* Add dedicated input props to file field

* Run Cypress using custom API

* Add missing error handling in file upload field

Co-authored-by: Krzysztof Wolski <krzysztof.k.wolski@gmail.com>

* Add file attribute upload to page attributes (#894)

* Support upload file attribute for pages

* Update after review

* Add file attribute upload to variant attributes (#892)

* Support upload file attribute for variants

* Update after review

* Refactor attribute values errors merging

* Update after review

* Add file attribute upload to product attributes (#826)

* Support upload file attribute for products

* Update after review

* Refactor attribute values errors merging

* Refactor product attribute value delete handling

* Fix deleting file in file upload field

* Fix delete attribute values errors handling

* Add link to file upload field (#898)

* Update file attributes updates (#899)

* Update file attributes updates

* Refactor file uploads handling

* Move attributes utils to attributes directory

* Fix product channel listing updates

* Clear file field value if file is not passed as prop

* Delete attribute values before update (#908)

* Delete file attributes after file update

* Triggr CI

* Show skeleton in file upload field during loading

Co-authored-by: Krzysztof Wolski <krzysztof.k.wolski@gmail.com>
2020-12-16 11:53:28 +01:00

320 lines
6.7 KiB
TypeScript

import { attributeValueFragment } from "@saleor/fragments/attributes";
import { pageInfoFragment } from "@saleor/fragments/pageInfo";
import {
fragmentVariant,
productFragment,
productFragmentDetails,
productVariantAttributesFragment,
variantAttributeFragment
} from "@saleor/fragments/products";
import { taxTypeFragment } from "@saleor/fragments/taxes";
import { warehouseFragment } from "@saleor/fragments/warehouses";
import makeQuery from "@saleor/hooks/makeQuery";
import gql from "graphql-tag";
import { CountAllProducts } from "./types/CountAllProducts";
import {
CreateMultipleVariantsData,
CreateMultipleVariantsDataVariables
} from "./types/CreateMultipleVariantsData";
import {
GridAttributes,
GridAttributesVariables
} from "./types/GridAttributes";
import {
InitialProductFilterData,
InitialProductFilterDataVariables
} from "./types/InitialProductFilterData";
import {
ProductDetails,
ProductDetailsVariables
} from "./types/ProductDetails";
import {
ProductImageById,
ProductImageByIdVariables
} from "./types/ProductImageById";
import { ProductList, ProductListVariables } from "./types/ProductList";
import {
ProductVariantCreateData,
ProductVariantCreateDataVariables
} from "./types/ProductVariantCreateData";
import {
ProductVariantDetails,
ProductVariantDetailsVariables
} from "./types/ProductVariantDetails";
const initialProductFilterDataQuery = gql`
query InitialProductFilterData(
$categories: [ID!]
$collections: [ID!]
$productTypes: [ID!]
) {
attributes(first: 100, filter: { filterableInDashboard: true }) {
edges {
node {
id
name
slug
values {
id
name
slug
}
}
}
}
categories(first: 100, filter: { ids: $categories }) {
edges {
node {
id
name
}
}
}
collections(first: 100, filter: { ids: $collections }) {
edges {
node {
id
name
}
}
}
productTypes(first: 100, filter: { ids: $productTypes }) {
edges {
node {
id
name
}
}
}
}
`;
export const useInitialProductFilterDataQuery = makeQuery<
InitialProductFilterData,
InitialProductFilterDataVariables
>(initialProductFilterDataQuery);
const productListQuery = gql`
${productFragment}
${attributeValueFragment}
query ProductList(
$first: Int
$after: String
$last: Int
$before: String
$filter: ProductFilterInput
$sort: ProductOrder
) {
products(
before: $before
after: $after
first: $first
last: $last
filter: $filter
sortBy: $sort
) {
edges {
node {
...ProductFragment
attributes {
attribute {
id
}
values {
...AttributeValueFragment
}
}
}
}
pageInfo {
hasPreviousPage
hasNextPage
startCursor
endCursor
}
totalCount
}
}
`;
export const useProductListQuery = makeQuery<ProductList, ProductListVariables>(
productListQuery
);
const countAllProductsQuery = gql`
query CountAllProducts {
products {
totalCount
}
}
`;
export const useCountAllProducts = makeQuery<CountAllProducts, null>(
countAllProductsQuery
);
const productDetailsQuery = gql`
${productFragmentDetails}
${taxTypeFragment}
query ProductDetails($id: ID!, $channel: String) {
product(id: $id, channel: $channel) {
...Product
}
taxTypes {
...TaxTypeFragment
}
}
`;
export const useProductDetails = makeQuery<
ProductDetails,
ProductDetailsVariables
>(productDetailsQuery);
export const useProductDetailsQuery = makeQuery<
ProductDetails,
ProductDetailsVariables
>(productDetailsQuery);
const productVariantQuery = gql`
${fragmentVariant}
query ProductVariantDetails($id: ID!) {
productVariant(id: $id) {
...ProductVariant
}
}
`;
export const useProductVariantQuery = makeQuery<
ProductVariantDetails,
ProductVariantDetailsVariables
>(productVariantQuery);
const productVariantCreateQuery = gql`
${variantAttributeFragment}
query ProductVariantCreateData($id: ID!) {
product(id: $id) {
id
images {
id
sortOrder
url
}
channelListings {
channel {
id
name
currencyCode
}
}
name
productType {
id
selectionVariantAttributes: variantAttributes(
variantSelection: VARIANT_SELECTION
) {
...VariantAttributeFragment
}
nonSelectionVariantAttributes: variantAttributes(
variantSelection: NOT_VARIANT_SELECTION
) {
...VariantAttributeFragment
}
}
thumbnail {
url
}
variants {
id
name
sku
images {
id
url
}
}
}
}
`;
export const useProductVariantCreateQuery = makeQuery<
ProductVariantCreateData,
ProductVariantCreateDataVariables
>(productVariantCreateQuery);
const productImageQuery = gql`
query ProductImageById($productId: ID!, $imageId: ID!) {
product(id: $productId) {
id
name
mainImage: imageById(id: $imageId) {
id
alt
url
}
images {
id
url(size: 48)
}
}
}
`;
export const useProductImageQuery = makeQuery<
ProductImageById,
ProductImageByIdVariables
>(productImageQuery);
const availableInGridAttributes = gql`
${pageInfoFragment}
query GridAttributes($first: Int!, $after: String, $ids: [ID!]!) {
availableInGrid: attributes(
first: $first
after: $after
filter: {
availableInGrid: true
isVariantOnly: false
type: PRODUCT_TYPE
}
) {
edges {
node {
id
name
}
}
pageInfo {
...PageInfoFragment
}
totalCount
}
grid: attributes(first: 25, filter: { ids: $ids }) {
edges {
node {
id
name
}
}
}
}
`;
export const useAvailableInGridAttributesQuery = makeQuery<
GridAttributes,
GridAttributesVariables
>(availableInGridAttributes);
const createMultipleVariantsData = gql`
${productVariantAttributesFragment}
${warehouseFragment}
query CreateMultipleVariantsData($id: ID!) {
product(id: $id) {
...ProductVariantAttributesFragment
}
warehouses(first: 20) {
edges {
node {
...WarehouseFragment
}
}
}
}
`;
export const useCreateMultipleVariantsData = makeQuery<
CreateMultipleVariantsData,
CreateMultipleVariantsDataVariables
>(createMultipleVariantsData);