Fix product type translations (#1163)

* Fix product type translations

* Update changelog

CHANGELOG.md

@@ -50,6 +50,7 @@ All notable, unreleased changes to this project will be documented in this file.
 - Add pagination on attribute values - #1112 by @orzechdev
 - Paginate attribute values in filters - #1152 by @orzechdev
 - Fix attribute values input display - #1156 by @orzechdev
+- Fix product type translations - #1163 by @orzechdev
 
 # 2.11.1
 

locale/defaultMessages.json

@@ -6735,6 +6735,10 @@
     "context": "header",
     "string": "Translation Attribute \"{attribute}\" - {languageCode}"
   },
+  "src_dot_translations_dot_components_dot_TranslationsProductTypesPage_dot_values": {
+    "context": "section name",
+    "string": "Values"
+  },
   "src_dot_translations_dot_components_dot_TranslationsProductsPage_dot_1406947243": {
     "string": "Search Engine Description"
   },

src/config.ts

@@ -41,6 +41,7 @@ export interface AppListViewSettings {
   [ListViews.VOUCHER_LIST]: ListSettings;
   [ListViews.WAREHOUSE_LIST]: ListSettings;
   [ListViews.WEBHOOK_LIST]: ListSettings;
+  [ListViews.TRANSLATION_ATTRIBUTE_VALUE_LIST]: ListSettings;
 }
 export const defaultListSettings: AppListViewSettings = {
   [ListViews.APPS_LIST]: {
@@ -97,6 +98,9 @@ export const defaultListSettings: AppListViewSettings = {
   },
   [ListViews.WEBHOOK_LIST]: {
     rowNumber: PAGINATE_BY
+  },
+  [ListViews.TRANSLATION_ATTRIBUTE_VALUE_LIST]: {
+    rowNumber: 10
   }
 };
 

src/fragments/translations.ts

@@ -1,5 +1,7 @@
 import gql from "graphql-tag";
 
+import { pageInfoFragment } from "./pageInfo";
+
 export const categoryTranslationFragment = gql`
   fragment CategoryTranslationFragment on CategoryTranslatableContent {
     translation(languageCode: $language) {
@@ -161,6 +163,29 @@ export const pageTranslatableFragment = gql`
   }
 `;
 
+export const attributeChoicesTranslationFragment = gql`
+  ${pageInfoFragment}
+  fragment AttributeChoicesTranslationFragment on AttributeValueCountableConnection {
+    pageInfo {
+      ...PageInfoFragment
+    }
+    edges {
+      cursor
+      node {
+        id
+        name
+        richText
+        inputType
+        translation(languageCode: $language) {
+          id
+          name
+          richText
+        }
+      }
+    }
+  }
+`;
+
 export const attributeTranslationFragment = gql`
   fragment AttributeTranslationFragment on AttributeTranslatableContent {
     translation(languageCode: $language) {
@@ -171,17 +196,29 @@ export const attributeTranslationFragment = gql`
       id
       name
       inputType
-      # values {
+    }
-      #   id
+  }
-      #   name
+`;
-      #   richText
+
-      #   inputType
+export const attributeTranslationDetailsFragment = gql`
-      #   translation(languageCode: $language) {
+  ${attributeChoicesTranslationFragment}
-      #     id
+  fragment AttributeTranslationDetailsFragment on AttributeTranslatableContent {
-      #     name
+    translation(languageCode: $language) {
-      #     richText
+      id
-      #   }
+      name
-      # }
+    }
+    attribute {
+      id
+      name
+      inputType
+      choices(
+        first: $firstValues
+        after: $afterValues
+        last: $lastValues
+        before: $beforeValues
+      ) {
+        ...AttributeChoicesTranslationFragment
+      }
     }
   }
 `;

src/fragments/types/AttributeChoicesTranslationFragment.ts

@@ -0,0 +1,46 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { AttributeInputTypeEnum } from "./../../types/globalTypes";
+
+// ====================================================
+// GraphQL fragment: AttributeChoicesTranslationFragment
+// ====================================================
+
+export interface AttributeChoicesTranslationFragment_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface AttributeChoicesTranslationFragment_edges_node_translation {
+  __typename: "AttributeValueTranslation";
+  id: string;
+  name: string;
+  richText: any | null;
+}
+
+export interface AttributeChoicesTranslationFragment_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  richText: any | null;
+  inputType: AttributeInputTypeEnum | null;
+  translation: AttributeChoicesTranslationFragment_edges_node_translation | null;
+}
+
+export interface AttributeChoicesTranslationFragment_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: AttributeChoicesTranslationFragment_edges_node;
+}
+
+export interface AttributeChoicesTranslationFragment {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: AttributeChoicesTranslationFragment_pageInfo;
+  edges: AttributeChoicesTranslationFragment_edges[];
+}

src/fragments/types/AttributeTranslationDetailsFragment.ts

@@ -0,0 +1,66 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { AttributeInputTypeEnum } from "./../../types/globalTypes";
+
+// ====================================================
+// GraphQL fragment: AttributeTranslationDetailsFragment
+// ====================================================
+
+export interface AttributeTranslationDetailsFragment_translation {
+  __typename: "AttributeTranslation";
+  id: string;
+  name: string;
+}
+
+export interface AttributeTranslationDetailsFragment_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface AttributeTranslationDetailsFragment_attribute_choices_edges_node_translation {
+  __typename: "AttributeValueTranslation";
+  id: string;
+  name: string;
+  richText: any | null;
+}
+
+export interface AttributeTranslationDetailsFragment_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  richText: any | null;
+  inputType: AttributeInputTypeEnum | null;
+  translation: AttributeTranslationDetailsFragment_attribute_choices_edges_node_translation | null;
+}
+
+export interface AttributeTranslationDetailsFragment_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: AttributeTranslationDetailsFragment_attribute_choices_edges_node;
+}
+
+export interface AttributeTranslationDetailsFragment_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: AttributeTranslationDetailsFragment_attribute_choices_pageInfo;
+  edges: AttributeTranslationDetailsFragment_attribute_choices_edges[];
+}
+
+export interface AttributeTranslationDetailsFragment_attribute {
+  __typename: "Attribute";
+  id: string;
+  name: string | null;
+  inputType: AttributeInputTypeEnum | null;
+  choices: AttributeTranslationDetailsFragment_attribute_choices | null;
+}
+
+export interface AttributeTranslationDetailsFragment {
+  __typename: "AttributeTranslatableContent";
+  translation: AttributeTranslationDetailsFragment_translation | null;
+  attribute: AttributeTranslationDetailsFragment_attribute | null;
+}

src/fragments/types/AttributeTranslationFragment.ts

@@ -15,28 +15,11 @@ export interface AttributeTranslationFragment_translation {
   name: string;
 }
 
-export interface AttributeTranslationFragment_attribute_values_translation {
-  __typename: "AttributeValueTranslation";
-  id: string;
-  name: string;
-  richText: any | null;
-}
-
-export interface AttributeTranslationFragment_attribute_values {
-  __typename: "AttributeValue";
-  id: string;
-  name: string | null;
-  richText: any | null;
-  inputType: AttributeInputTypeEnum | null;
-  translation: AttributeTranslationFragment_attribute_values_translation | null;
-}
-
 export interface AttributeTranslationFragment_attribute {
   __typename: "Attribute";
   id: string;
   name: string | null;
   inputType: AttributeInputTypeEnum | null;
-  values: (AttributeTranslationFragment_attribute_values | null)[] | null;
 }
 
 export interface AttributeTranslationFragment {

src/fragments/types/CategoryTranslationFragment.ts

@@ -17,7 +17,7 @@ export interface CategoryTranslationFragment_translation {
   id: string;
   description: any | null;
   language: CategoryTranslationFragment_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/fragments/types/CollectionTranslationFragment.ts

@@ -26,7 +26,7 @@ export interface CollectionTranslationFragment_translation {
   id: string;
   description: any | null;
   language: CollectionTranslationFragment_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/fragments/types/PageTranslatableFragment.ts

@@ -21,7 +21,7 @@ export interface PageTranslatableFragment_translation {
   content: any | null;
   seoDescription: string | null;
   seoTitle: string | null;
-  title: string;
+  title: string | null;
   language: PageTranslatableFragment_translation_language;
 }
 

src/fragments/types/PageTranslationFragment.ts

@@ -30,7 +30,7 @@ export interface PageTranslationFragment_translation {
   content: any | null;
   seoDescription: string | null;
   seoTitle: string | null;
-  title: string;
+  title: string | null;
   language: PageTranslationFragment_translation_language;
 }
 

src/fragments/types/ProductTranslationFragment.ts

@@ -29,7 +29,7 @@ export interface ProductTranslationFragment_translation {
   id: string;
   description: any | null;
   language: ProductTranslationFragment_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/products/types/SimpleProductUpdate.ts

@@ -353,6 +353,42 @@ export interface SimpleProductUpdate_productVariantUpdate_productVariant_private
   value: string;
 }
 
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -362,6 +398,7 @@ export interface SimpleProductUpdate_productVariantUpdate_productVariant_selecti
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_values_file {
@@ -386,6 +423,42 @@ export interface SimpleProductUpdate_productVariantUpdate_productVariant_selecti
   values: (SimpleProductUpdate_productVariantUpdate_productVariant_selectionAttributes_values | null)[];
 }
 
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -395,6 +468,7 @@ export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSele
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantUpdate_productVariant_nonSelectionAttributes_values_file {
@@ -610,6 +684,42 @@ export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_p
   value: string;
 }
 
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -619,6 +729,7 @@ export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_s
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_values_file {
@@ -643,6 +754,42 @@ export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_s
   values: (SimpleProductUpdate_productVariantStocksCreate_productVariant_selectionAttributes_values | null)[];
 }
 
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -652,6 +799,7 @@ export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_n
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantStocksCreate_productVariant_nonSelectionAttributes_values_file {
@@ -866,6 +1014,42 @@ export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_p
   value: string;
 }
 
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -875,6 +1059,7 @@ export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_s
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_values_file {
@@ -899,6 +1084,42 @@ export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_s
   values: (SimpleProductUpdate_productVariantStocksDelete_productVariant_selectionAttributes_values | null)[];
 }
 
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -908,6 +1129,7 @@ export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_n
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantStocksDelete_productVariant_nonSelectionAttributes_values_file {
@@ -1123,6 +1345,42 @@ export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_p
   value: string;
 }
 
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -1132,6 +1390,7 @@ export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_s
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_values_file {
@@ -1156,6 +1415,42 @@ export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_s
   values: (SimpleProductUpdate_productVariantStocksUpdate_productVariant_selectionAttributes_values | null)[];
 }
 
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file {
+  __typename: "File";
+  url: string;
+  contentType: string | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+  file: SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node_file | null;
+  reference: string | null;
+  richText: any | null;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges_node;
+}
+
+export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_pageInfo;
+  edges: SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices_edges[];
+}
+
 export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute {
   __typename: "Attribute";
   id: string;
@@ -1165,6 +1460,7 @@ export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_n
   entityType: AttributeEntityTypeEnum | null;
   valueRequired: boolean;
   unit: MeasurementUnitsEnum | null;
+  choices: SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_attribute_choices | null;
 }
 
 export interface SimpleProductUpdate_productVariantStocksUpdate_productVariant_nonSelectionAttributes_values_file {

src/translations/components/TranslationFields/TranslationFields.tsx

@@ -12,8 +12,10 @@ import { ConfirmButtonTransitionState } from "@saleor/components/ConfirmButton";
 import Grid from "@saleor/components/Grid";
 import Hr from "@saleor/components/Hr";
 import Skeleton from "@saleor/components/Skeleton";
+import TablePagination from "@saleor/components/TablePagination";
 import { buttonMessages } from "@saleor/intl";
 import { makeStyles } from "@saleor/theme";
+import { ListProps } from "@saleor/types";
 import classNames from "classnames";
 import React from "react";
 import { FormattedMessage } from "react-intl";
@@ -30,6 +32,11 @@ export interface TranslationField {
   value: string;
 }
 
+type Pagination = Pick<
+  ListProps,
+  Exclude<keyof ListProps, "onRowClick" | "disabled">
+>;
+
 export interface TranslationFieldsProps {
   activeField: string;
   disabled: boolean;
@@ -37,6 +44,7 @@ export interface TranslationFieldsProps {
   fields: TranslationField[];
   initialState: boolean;
   saveButtonState: ConfirmButtonTransitionState;
+  pagination?: Pagination;
   onEdit: (field: string) => void;
   onDiscard: () => void;
   onSubmit: (field: string, data: string | OutputData) => void;
@@ -107,6 +115,9 @@ const useStyles = makeStyles(
   }),
   { name: "TranslationFields" }
 );
+
+const numberOfColumns = 2;
+
 const TranslationFields: React.FC<TranslationFieldsProps> = props => {
   const {
     activeField,
@@ -115,6 +126,7 @@ const TranslationFields: React.FC<TranslationFieldsProps> = props => {
     initialState,
     title,
     saveButtonState,
+    pagination,
     onEdit,
     onDiscard,
     onSubmit
@@ -231,6 +243,26 @@ const TranslationFields: React.FC<TranslationFieldsProps> = props => {
               </React.Fragment>
             ))}
           </Grid>
+          {pagination && (
+            <TablePagination
+              colSpan={numberOfColumns}
+              hasNextPage={
+                pagination.pageInfo && !disabled
+                  ? pagination.pageInfo.hasNextPage
+                  : false
+              }
+              onNextPage={pagination.onNextPage}
+              hasPreviousPage={
+                pagination.pageInfo && !disabled
+                  ? pagination.pageInfo.hasPreviousPage
+                  : false
+              }
+              onPreviousPage={pagination.onPreviousPage}
+              settings={pagination.settings}
+              onUpdateListSettings={pagination.onUpdateListSettings}
+              component="div"
+            />
+          )}
         </CardContent>
       ) : (
         <CardContent>

src/translations/components/TranslationsEntitiesList/TranslationsEntitiesList.tsx

@@ -102,17 +102,18 @@ const TranslationsEntitiesList: React.FC<TranslationsEntitiesListProps> = props
             >
               <TableCell>{entity?.name || <Skeleton />}</TableCell>
               <TableCell className={classes.textRight}>
-                {maybe<React.ReactNode>(
+                {entity.completion !== null &&
-                  () =>
+                  maybe<React.ReactNode>(
-                    intl.formatMessage(
+                    () =>
-                      {
+                      intl.formatMessage(
-                        defaultMessage: "{current} of {max}",
+                        {
-                        description: "translation progress"
+                          defaultMessage: "{current} of {max}",
-                      },
+                          description: "translation progress"
-                      entity.completion
+                        },
-                    ),
+                        entity.completion
-                  <Skeleton />
+                      ),
-                )}
+                    <Skeleton />
+                  )}
               </TableCell>
             </TableRow>
           ),

src/translations/components/TranslationsProductTypesPage/TranslationsProductTypesPage.tsx

@@ -1,12 +1,14 @@
 import AppHeader from "@saleor/components/AppHeader";
+import CardSpacer from "@saleor/components/CardSpacer";
 import Container from "@saleor/components/Container";
 import LanguageSwitch from "@saleor/components/LanguageSwitch";
 import PageHeader from "@saleor/components/PageHeader";
-import { AttributeTranslationFragment } from "@saleor/fragments/types/AttributeTranslationFragment";
+import { AttributeTranslationDetailsFragment } from "@saleor/fragments/types/AttributeTranslationDetailsFragment";
 import { commonMessages, sectionNames } from "@saleor/intl";
 import { TranslationsEntitiesPageProps } from "@saleor/translations/types";
+import { ListSettings } from "@saleor/types";
 import React from "react";
-import { useIntl } from "react-intl";
+import { defineMessages, useIntl } from "react-intl";
 
 import {
   AttributeInputTypeEnum,
@@ -14,9 +16,24 @@ import {
 } from "../../../types/globalTypes";
 import TranslationFields, { TranslationField } from "../TranslationFields";
 
+export const messages = defineMessages({
+  values: {
+    defaultMessage: "Values",
+    description: "section name"
+  }
+});
+
 export interface TranslationsProductTypesPageProps
   extends TranslationsEntitiesPageProps {
-  data: AttributeTranslationFragment;
+  data: AttributeTranslationDetailsFragment;
+  settings?: ListSettings;
+  onUpdateListSettings?: (key: keyof ListSettings, value: any) => void;
+  pageInfo: {
+    hasNextPage: boolean;
+    hasPreviousPage: boolean;
+  };
+  onNextPage: () => void;
+  onPreviousPage: () => void;
 }
 
 export const fieldNames = {
@@ -36,7 +53,12 @@ const TranslationsProductTypesPage: React.FC<TranslationsProductTypesPageProps>
   onDiscard,
   onEdit,
   onLanguageChange,
-  onSubmit
+  onSubmit,
+  settings,
+  onUpdateListSettings,
+  pageInfo,
+  onNextPage,
+  onPreviousPage
 }) => {
   const intl = useIntl();
 
@@ -78,9 +100,22 @@ const TranslationsProductTypesPage: React.FC<TranslationsProductTypesPageProps>
             translation: data?.translation?.name || null,
             type: "short" as "short",
             value: data?.attribute?.name
-          },
+          }
-          ...(data?.attribute?.values?.map(
+        ]}
-            (attributeValue, attributeValueIndex) => {
+        saveButtonState={saveButtonState}
+        onEdit={onEdit}
+        onDiscard={onDiscard}
+        onSubmit={onSubmit}
+      />
+      <CardSpacer />
+      <TranslationFields
+        activeField={activeField}
+        disabled={disabled}
+        initialState={true}
+        title={intl.formatMessage(messages.values)}
+        fields={
+          data?.attribute?.choices?.edges?.map(
+            ({ node: attributeValue }, attributeValueIndex) => {
               const isRichText =
                 attributeValue?.inputType === AttributeInputTypeEnum.RICH_TEXT;
               const displayName = isRichText
@@ -115,9 +150,16 @@ const TranslationsProductTypesPage: React.FC<TranslationsProductTypesPageProps>
                   : attributeValue?.name
               };
             }
-          ) || [])
+          ) || []
-        ]}
+        }
         saveButtonState={saveButtonState}
+        pagination={{
+          settings,
+          onUpdateListSettings,
+          pageInfo,
+          onNextPage,
+          onPreviousPage
+        }}
         onEdit={onEdit}
         onDiscard={onDiscard}
         onSubmit={onSubmit}

src/translations/queries.ts

@@ -1,5 +1,6 @@
 import { pageInfoFragment } from "@saleor/fragments/pageInfo";
 import {
+  attributeTranslationDetailsFragment,
   attributeTranslationFragment,
   categoryTranslationFragment,
   collectionTranslationFragment,
@@ -421,10 +422,17 @@ export const useVoucherTranslationDetails = makeQuery<
 >(voucherTranslationDetails);
 
 const attributeTranslationDetails = gql`
-  ${attributeTranslationFragment}
+  ${attributeTranslationDetailsFragment}
-  query AttributeTranslationDetails($id: ID!, $language: LanguageCodeEnum!) {
+  query AttributeTranslationDetails(
+    $id: ID!
+    $language: LanguageCodeEnum!
+    $firstValues: Int
+    $afterValues: String
+    $lastValues: Int
+    $beforeValues: String
+  ) {
     translation(kind: ATTRIBUTE, id: $id) {
-      ...AttributeTranslationFragment
+      ...AttributeTranslationDetailsFragment
     }
   }
 `;

src/translations/types/AttributeTranslationDetails.ts

@@ -19,20 +19,40 @@ export interface AttributeTranslationDetails_translation_AttributeTranslatableCo
   name: string;
 }
 
-export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_values_translation {
+export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_pageInfo {
+  __typename: "PageInfo";
+  endCursor: string | null;
+  hasNextPage: boolean;
+  hasPreviousPage: boolean;
+  startCursor: string | null;
+}
+
+export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_edges_node_translation {
   __typename: "AttributeValueTranslation";
   id: string;
   name: string;
   richText: any | null;
 }
 
-export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_values {
+export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_edges_node {
   __typename: "AttributeValue";
   id: string;
   name: string | null;
   richText: any | null;
   inputType: AttributeInputTypeEnum | null;
-  translation: AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_values_translation | null;
+  translation: AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_edges_node_translation | null;
+}
+
+export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_edges {
+  __typename: "AttributeValueCountableEdge";
+  cursor: string;
+  node: AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_edges_node;
+}
+
+export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices {
+  __typename: "AttributeValueCountableConnection";
+  pageInfo: AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_pageInfo;
+  edges: AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices_edges[];
 }
 
 export interface AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute {
@@ -40,7 +60,7 @@ export interface AttributeTranslationDetails_translation_AttributeTranslatableCo
   id: string;
   name: string | null;
   inputType: AttributeInputTypeEnum | null;
-  values: (AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_values | null)[] | null;
+  choices: AttributeTranslationDetails_translation_AttributeTranslatableContent_attribute_choices | null;
 }
 
 export interface AttributeTranslationDetails_translation_AttributeTranslatableContent {
@@ -58,4 +78,8 @@ export interface AttributeTranslationDetails {
 export interface AttributeTranslationDetailsVariables {
   id: string;
   language: LanguageCodeEnum;
+  firstValues?: number | null;
+  afterValues?: string | null;
+  lastValues?: number | null;
+  beforeValues?: string | null;
 }

src/translations/types/AttributeTranslations.ts

@@ -19,28 +19,11 @@ export interface AttributeTranslations_translations_edges_node_AttributeTranslat
   name: string;
 }
 
-export interface AttributeTranslations_translations_edges_node_AttributeTranslatableContent_attribute_values_translation {
-  __typename: "AttributeValueTranslation";
-  id: string;
-  name: string;
-  richText: any | null;
-}
-
-export interface AttributeTranslations_translations_edges_node_AttributeTranslatableContent_attribute_values {
-  __typename: "AttributeValue";
-  id: string;
-  name: string | null;
-  richText: any | null;
-  inputType: AttributeInputTypeEnum | null;
-  translation: AttributeTranslations_translations_edges_node_AttributeTranslatableContent_attribute_values_translation | null;
-}
-
 export interface AttributeTranslations_translations_edges_node_AttributeTranslatableContent_attribute {
   __typename: "Attribute";
   id: string;
   name: string | null;
   inputType: AttributeInputTypeEnum | null;
-  values: (AttributeTranslations_translations_edges_node_AttributeTranslatableContent_attribute_values | null)[] | null;
 }
 
 export interface AttributeTranslations_translations_edges_node_AttributeTranslatableContent {

src/translations/types/CategoryTranslationDetails.ts

@@ -23,7 +23,7 @@ export interface CategoryTranslationDetails_translation_CategoryTranslatableCont
   id: string;
   description: any | null;
   language: CategoryTranslationDetails_translation_CategoryTranslatableContent_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/CategoryTranslations.ts

@@ -23,7 +23,7 @@ export interface CategoryTranslations_translations_edges_node_CategoryTranslatab
   id: string;
   description: any | null;
   language: CategoryTranslations_translations_edges_node_CategoryTranslatableContent_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/CollectionTranslationDetails.ts

@@ -32,7 +32,7 @@ export interface CollectionTranslationDetails_translation_CollectionTranslatable
   id: string;
   description: any | null;
   language: CollectionTranslationDetails_translation_CollectionTranslatableContent_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/CollectionTranslations.ts

@@ -32,7 +32,7 @@ export interface CollectionTranslations_translations_edges_node_CollectionTransl
   id: string;
   description: any | null;
   language: CollectionTranslations_translations_edges_node_CollectionTranslatableContent_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/PageTranslationDetails.ts

@@ -34,7 +34,7 @@ export interface PageTranslationDetails_translation_PageTranslatableContent_tran
   content: any | null;
   seoDescription: string | null;
   seoTitle: string | null;
-  title: string;
+  title: string | null;
   language: PageTranslationDetails_translation_PageTranslatableContent_translation_language;
 }
 

src/translations/types/PageTranslations.ts

@@ -34,7 +34,7 @@ export interface PageTranslations_translations_edges_node_PageTranslatableConten
   content: any | null;
   seoDescription: string | null;
   seoTitle: string | null;
-  title: string;
+  title: string | null;
   language: PageTranslations_translations_edges_node_PageTranslatableContent_translation_language;
 }
 

src/translations/types/ProductTranslationDetails.ts

@@ -33,7 +33,7 @@ export interface ProductTranslationDetails_translation_ProductTranslatableConten
   id: string;
   description: any | null;
   language: ProductTranslationDetails_translation_ProductTranslatableContent_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/ProductTranslations.ts

@@ -33,7 +33,7 @@ export interface ProductTranslations_translations_edges_node_ProductTranslatable
   id: string;
   description: any | null;
   language: ProductTranslations_translations_edges_node_ProductTranslatableContent_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/UpdateCategoryTranslations.ts

@@ -25,7 +25,7 @@ export interface UpdateCategoryTranslations_categoryTranslate_category_translati
   id: string;
   description: any | null;
   language: UpdateCategoryTranslations_categoryTranslate_category_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/UpdateCollectionTranslations.ts

@@ -25,7 +25,7 @@ export interface UpdateCollectionTranslations_collectionTranslate_collection_tra
   id: string;
   description: any | null;
   language: UpdateCollectionTranslations_collectionTranslate_collection_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/types/UpdatePageTranslations.ts

@@ -36,7 +36,7 @@ export interface UpdatePageTranslations_pageTranslate_page_translation {
   content: any | null;
   seoDescription: string | null;
   seoTitle: string | null;
-  title: string;
+  title: string | null;
   language: UpdatePageTranslations_pageTranslate_page_translation_language;
 }
 

src/translations/types/UpdateProductTranslations.ts

@@ -26,7 +26,7 @@ export interface UpdateProductTranslations_productTranslate_product_translation
   id: string;
   description: any | null;
   language: UpdateProductTranslations_productTranslate_product_translation_language;
-  name: string;
+  name: string | null;
   seoDescription: string | null;
   seoTitle: string | null;
 }

src/translations/views/TranslationsEntities.tsx

@@ -394,17 +394,7 @@ const TranslationsEntities: React.FC<TranslationsEntitiesProps> = ({
                 entities={mapEdgesToItems(data?.translations).map(
                   node =>
                     node.__typename === "AttributeTranslatableContent" && {
-                      completion: {
+                      completion: null,
-                        current: sumCompleted([
-                          node.translation?.name,
-                          ...(node.attribute?.values.map(
-                            attr => attr.translation?.name
-                          ) || [])
-                        ]),
-                        max: node.attribute
-                          ? node.attribute.values.length + 1
-                          : 0
-                      },
                       id: node?.attribute.id,
                       name: node?.attribute.name
                     }

src/translations/views/TranslationsProductTypes.tsx

@@ -1,8 +1,13 @@
 import { OutputData } from "@editorjs/editorjs";
+import useListSettings from "@saleor/hooks/useListSettings";
+import useLocalPaginator, {
+  useLocalPaginationState
+} from "@saleor/hooks/useLocalPaginator";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
 import useShop from "@saleor/hooks/useShop";
 import { commonMessages } from "@saleor/intl";
+import { ListViews, Pagination } from "@saleor/types";
 import { stringify as stringifyQs } from "qs";
 import React from "react";
 import { useIntl } from "react-intl";
@@ -25,7 +30,7 @@ import {
   TranslatableEntities
 } from "../urls";
 
-export interface TranslationsProductTypesQueryParams {
+export interface TranslationsProductTypesQueryParams extends Pagination {
   activeField: string;
 }
 export interface TranslationsProductTypesProps {
@@ -44,9 +49,35 @@ const TranslationsProductTypes: React.FC<TranslationsProductTypesProps> = ({
   const shop = useShop();
   const intl = useIntl();
 
+  const { updateListSettings, settings } = useListSettings(
+    ListViews.TRANSLATION_ATTRIBUTE_VALUE_LIST
+  );
+  const [
+    valuesPaginationState,
+    setValuesPaginationState
+  ] = useLocalPaginationState(settings?.rowNumber);
+
   const attributeTranslations = useAttributeTranslationDetails({
-    variables: { id, language: languageCode }
+    variables: {
+      id,
+      language: languageCode,
+      firstValues: valuesPaginationState.first,
+      lastValues: valuesPaginationState.last,
+      afterValues: valuesPaginationState.after,
+      beforeValues: valuesPaginationState.before
+    }
   });
+  const translationData = attributeTranslations?.data?.translation;
+  const translation =
+    translationData?.__typename === "AttributeTranslatableContent"
+      ? translationData
+      : null;
+
+  const paginateValues = useLocalPaginator(setValuesPaginationState);
+  const { loadNextPage, loadPreviousPage, pageInfo } = paginateValues(
+    translation?.attribute?.choices?.pageInfo,
+    valuesPaginationState
+  );
 
   const onEdit = (field: string) =>
     navigate(
@@ -135,7 +166,6 @@ const TranslationsProductTypes: React.FC<TranslationsProductTypesProps> = ({
                 []
               )
             );
-            const translation = attributeTranslations?.data?.translation;
 
             return (
               <TranslationsProductTypesPage
@@ -167,11 +197,12 @@ const TranslationsProductTypes: React.FC<TranslationsProductTypesProps> = ({
                   )
                 }
                 onSubmit={handleSubmit}
-                data={
+                data={translation}
-                  translation?.__typename === "AttributeTranslatableContent"
+                settings={settings}
-                    ? translation
+                onUpdateListSettings={updateListSettings}
-                    : null
+                pageInfo={pageInfo}
-                }
+                onNextPage={loadNextPage}
+                onPreviousPage={loadPreviousPage}
               />
             );
           }}

src/types.ts

@@ -41,7 +41,8 @@ export enum ListViews {
   STAFF_MEMBERS_LIST = "STAFF_MEMBERS_LIST",
   VOUCHER_LIST = "VOUCHER_LIST",
   WAREHOUSE_LIST = "WAREHOUSE_LIST",
-  WEBHOOK_LIST = "WEBHOOK_LIST"
+  WEBHOOK_LIST = "WEBHOOK_LIST",
+  TRANSLATION_ATTRIBUTE_VALUE_LIST = "TRANSLATION_ATTRIBUTE_VALUE_LIST"
 }
 
 export interface ListProps<TColumns extends string = string> {

src/types/globalTypes.ts

@@ -761,6 +761,7 @@ export enum PaymentChargeStatusEnum {
 }
 
 export enum PermissionEnum {
+  HANDLE_PAYMENTS = "HANDLE_PAYMENTS",
   MANAGE_APPS = "MANAGE_APPS",
   MANAGE_CHANNELS = "MANAGE_CHANNELS",
   MANAGE_CHECKOUTS = "MANAGE_CHECKOUTS",
@@ -770,7 +771,6 @@ export enum PermissionEnum {
   MANAGE_ORDERS = "MANAGE_ORDERS",
   MANAGE_PAGES = "MANAGE_PAGES",
   MANAGE_PAGE_TYPES_AND_ATTRIBUTES = "MANAGE_PAGE_TYPES_AND_ATTRIBUTES",
-  HANDLE_PAYMENTS = "HANDLE_PAYMENTS",
   MANAGE_PLUGINS = "MANAGE_PLUGINS",
   MANAGE_PRODUCTS = "MANAGE_PRODUCTS",
   MANAGE_PRODUCT_TYPES_AND_ATTRIBUTES = "MANAGE_PRODUCT_TYPES_AND_ATTRIBUTES",
@@ -1273,6 +1273,7 @@ export interface CustomerFilterInput {
   numberOfOrders?: IntRangeInput | null;
   placedOrders?: DateRangeInput | null;
   search?: string | null;
+  metadata?: (MetadataInput | null)[] | null;
 }
 
 export interface CustomerInput {
@@ -1519,6 +1520,7 @@ export interface PageFilterInput {
   search?: string | null;
   metadata?: (MetadataInput | null)[] | null;
   pageTypes?: (string | null)[] | null;
+  ids?: (string | null)[] | null;
 }
 
 export interface PageInput {