Fix types

src/channels/components/ShippingZonesCard/ShippingZoneItem.tsx

@@ -1,6 +1,6 @@
 import { Divider, Typography } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
-import { Channel_channel_shippingZones } from "@saleor/channels/types/Channel";
+import { ChannelShippingZone } from "@saleor/channels/pages/ChannelDetailsPage/types";
 import DeletableItem from "@saleor/components/DeletableItem";
 import React from "react";
 
@@ -18,7 +18,7 @@ const useStyles = makeStyles(
 );
 
 interface ShippingZoneItemProps {
-  zone: Channel_channel_shippingZones;
+  zone: ChannelShippingZone;
   onDelete: (id: string) => void;
 }
 

src/channels/components/ShippingZonesCard/ShippingZonesCard.stories.tsx

@@ -1,4 +1,4 @@
-import { Channel_channel_shippingZones } from "@saleor/channels/types/Channel";
+import { ChannelShippingZones } from "@saleor/channels/pages/ChannelDetailsPage/types";
 import CommonDecorator from "@saleor/storybook/Decorator";
 import { storiesOf } from "@storybook/react";
 import React from "react";
@@ -28,7 +28,7 @@ const baseProps = {
     onFetchMore: () => undefined
   },
   shippingZones: [],
-  shippingZonesChoices: shippingZones as Channel_channel_shippingZones[]
+  shippingZonesChoices: shippingZones as ChannelShippingZones
 };
 
 storiesOf("Shipping zones card", module)
@@ -37,6 +37,6 @@ storiesOf("Shipping zones card", module)
   .add("with options selected", () => (
     <ShippingZonesCard
       {...baseProps}
-      shippingZones={shippingZones as Channel_channel_shippingZones[]}
+      shippingZones={shippingZones as ChannelShippingZones}
     />
   ));

src/channels/components/ShippingZonesCard/ShippingZonesCardListFooter.tsx

@@ -1,5 +1,5 @@
 import { ClickAwayListener } from "@material-ui/core";
-import { Channel_channel_shippingZones } from "@saleor/channels/types/Channel";
+import { ChannelShippingZones } from "@saleor/channels/pages/ChannelDetailsPage/types";
 import SingleAutocompleteSelectField from "@saleor/components/SingleAutocompleteSelectField";
 import CardAddItemsFooter from "@saleor/products/components/ProductStocks/CardAddItemsFooter";
 import { mapNodeToChoice } from "@saleor/utils/maps";
@@ -25,9 +25,7 @@ const ShippingZonesCardListFooter: React.FC<ShippingZonesCardListFooterProps> =
   shippingZones
 }) => {
   const [isChoicesSelectShown, setIsChoicesSelectShown] = useState(false);
-  const shippingZonesRef = useRef<Channel_channel_shippingZones[]>(
-    shippingZones
-  );
+  const shippingZonesRef = useRef<ChannelShippingZones>(shippingZones);
 
   // select holds value and displays it so it needs remounting
   // to display empty input after adding new zone

src/channels/components/ShippingZonesCard/ShippingZonesListHeader.tsx

@@ -1,7 +1,7 @@
 import { ExpansionPanelSummary, Typography } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 import HorizontalSpacer from "@saleor/apps/components/HorizontalSpacer";
-import { Channel_channel_shippingZones } from "@saleor/channels/types/Channel";
+import { ChannelShippingZones } from "@saleor/channels/pages/ChannelDetailsPage/types";
 import IconChevronDown from "@saleor/icons/ChevronDown";
 import React from "react";
 import { defineMessages, useIntl } from "react-intl";
@@ -47,7 +47,7 @@ const messages = defineMessages({
 });
 
 interface ShippingZonesListHeaderProps {
-  shippingZones: Channel_channel_shippingZones[];
+  shippingZones: ChannelShippingZones;
 }
 
 const ShippingZonesListHeader: React.FC<ShippingZonesListHeaderProps> = ({

src/channels/components/ShippingZonesCard/types.ts

@@ -1,4 +1,4 @@
-import { Channel_channel_shippingZones } from "@saleor/channels/types/Channel";
+import { ChannelShippingZones } from "@saleor/channels/pages/ChannelDetailsPage/types";
 import { SearchShippingZones_search_edges_node } from "@saleor/searches/types/SearchShippingZones";
 import { FetchMoreProps } from "@saleor/types";
 
@@ -7,6 +7,6 @@ export interface ShippingZonesProps {
   removeShippingZone: (id: string) => void;
   searchShippingZones: (searchPhrase: string) => void;
   fetchMoreShippingZones: FetchMoreProps;
-  shippingZones: Channel_channel_shippingZones[];
+  shippingZones: ChannelShippingZones;
   shippingZonesChoices: SearchShippingZones_search_edges_node[];
 }

src/channels/fixtures.ts

@@ -18,7 +18,6 @@ export const channelsList: Channels_channels[] = [
   {
     __typename: "Channel",
     currencyCode: "euro",
-    shippingZones: [],
     hasOrders: false,
     id: "Q2hhbm5lcDoy",
     isActive: true,
@@ -28,7 +27,6 @@ export const channelsList: Channels_channels[] = [
   {
     __typename: "Channel",
     currencyCode: "euro",
-    shippingZones: [],
     hasOrders: false,
     id: "Q2hhbm7lbDoy213",
     isActive: true,
@@ -39,7 +37,6 @@ export const channelsList: Channels_channels[] = [
     __typename: "Channel",
     currencyCode: "euro",
     hasOrders: false,
-    shippingZones: [],
     id: "Q2hhbn5lbDoytr",
     isActive: true,
     name: "Channel test",
@@ -48,7 +45,6 @@ export const channelsList: Channels_channels[] = [
   {
     __typename: "Channel",
     currencyCode: "euro",
-    shippingZones: [],
     hasOrders: false,
     id: "Q2hhbm5lbDo5bot",
     isActive: true,
@@ -58,7 +54,6 @@ export const channelsList: Channels_channels[] = [
   {
     __typename: "Channel",
     currencyCode: "euro",
-    shippingZones: [],
     hasOrders: false,
     id: "Q2hhbm7lbDoyr0tr",
     isActive: true,
@@ -68,7 +63,6 @@ export const channelsList: Channels_channels[] = [
   {
     __typename: "Channel",
     currencyCode: "euro",
-    shippingZones: [],
     hasOrders: false,
     id: "Q2hhbn5lbDoyya",
     isActive: true,
@@ -78,7 +72,6 @@ export const channelsList: Channels_channels[] = [
   {
     __typename: "Channel",
     currencyCode: "euro",
-    shippingZones: [],
     hasOrders: false,
     id: "Q2hhbm5lbDo5w0z",
     isActive: true,
@@ -90,7 +83,6 @@ export const channelsList: Channels_channels[] = [
 export const channel: Channel_channel = {
   __typename: "Channel",
   currencyCode: "zl",
-  shippingZones: [],
   hasOrders: false,
   id: "Q2hhbm5lbDov78",
   isActive: true,

src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.stories.tsx

@@ -21,6 +21,18 @@ const props: ChannelDetailsPageProps = {
   updateChannelStatus: () => undefined,
   searchShippingZones: () => undefined,
   searchShippingZonesData: undefined,
+  channelShippingZones: [
+    {
+      __typename: "ShippingZone",
+      id: "zone-1",
+      name: "Europe"
+    },
+    {
+      __typename: "ShippingZone",
+      id: "zone-2",
+      name: "USA"
+    }
+  ],
   fetchMoreShippingZones: {
     loading: false,
     hasMore: false,

src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx

@@ -38,7 +38,7 @@ export interface ChannelDetailsPageProps {
   searchShippingZones: (query: string) => void;
   searchShippingZonesData?: SearchData;
   fetchMoreShippingZones: FetchMoreProps;
-  channelShippingZones: ChannelShippingZones;
+  channelShippingZones?: ChannelShippingZones;
 }
 
 export const ChannelDetailsPage: React.FC<ChannelDetailsPageProps> = ({
@@ -55,13 +55,13 @@ export const ChannelDetailsPage: React.FC<ChannelDetailsPageProps> = ({
   searchShippingZones,
   searchShippingZonesData,
   fetchMoreShippingZones,
-  channelShippingZones
+  channelShippingZones = []
 }) => {
   const [selectedCurrencyCode, setSelectedCurrencyCode] = useState("");
 
   const [shippingZonesToDisplay, setShippingZonesToDisplay] = useStateFromProps<
     ChannelShippingZones
-  >(channelShippingZones || []);
+  >(channelShippingZones);
 
   const initialData: FormData = {
     currencyCode: "",

src/channels/pages/ChannelDetailsPage/types.ts

@@ -1,3 +1,5 @@
-import { ShippingZoneChannels_shippingZones_edges_node } from "@saleor/shipping/types/ShippingZoneChannels";
+import { ChannelShippingZones_shippingZones_edges_node } from "@saleor/shipping/types/ChannelShippingZones";
 
-export type ChannelShippingZones = ShippingZoneChannels_shippingZones_edges_node[];
+export type ChannelShippingZone = ChannelShippingZones_shippingZones_edges_node;
+
+export type ChannelShippingZones = ChannelShippingZone[];

src/channels/views/ChannelDetails/ChannelDetails.tsx

@@ -185,7 +185,9 @@ export const ChannelDetails: React.FC<ChannelDetailsProps> = ({
         </AppHeader>
         <PageHeader title={data?.channel?.name} />
         <ChannelDetailsPage
-          channelShippingZones={channelShippingZonesData?.shippingZones?.edges}
+          channelShippingZones={channelShippingZonesData?.shippingZones?.edges?.map(
+            ({ node }) => node
+          )}
           searchShippingZones={searchShippingZones}
           searchShippingZonesData={searchShippingZonesResult.data}
           fetchMoreShippingZones={getSearchFetchMoreProps(

src/shipping/queries.ts

@@ -11,6 +11,10 @@ import {
   ChannelShippingZonesVariables
 } from "./types/ChannelShippingZones";
 import { ShippingZone, ShippingZoneVariables } from "./types/ShippingZone";
+import {
+  ShippingZoneChannels,
+  ShippingZoneChannelsVariables
+} from "./types/ShippingZoneChannels";
 import { ShippingZones, ShippingZonesVariables } from "./types/ShippingZones";
 
 const shippingZones = gql`
@@ -71,6 +75,24 @@ export const useShippingZone = makeQuery<ShippingZone, ShippingZoneVariables>(
   shippingZone
 );
 
+const shippingZoneChannels = gql`
+  query ShippingZoneChannels($id: ID!) {
+    shippingZone(id: $id) {
+      id
+      channels {
+        id
+        name
+        currencyCode
+      }
+    }
+  }
+`;
+
+export const useShippingZoneChannels = makeQuery<
+  ShippingZoneChannels,
+  ShippingZoneChannelsVariables
+>(shippingZoneChannels);
+
 const channelShippingZones = gql`
   query ChannelShippingZones($filter: ShippingZoneFilterInput) {
     shippingZones(filter: $filter) {

src/shipping/types/ShippingZoneChannels.ts

@@ -3,32 +3,27 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import { ShippingZoneFilterInput } from "./../../types/globalTypes";
-
 // ====================================================
 // GraphQL query operation: ShippingZoneChannels
 // ====================================================
 
-export interface ShippingZoneChannels_shippingZones_edges_node {
-  __typename: "ShippingZone";
+export interface ShippingZoneChannels_shippingZone_channels {
+  __typename: "Channel";
   id: string;
   name: string;
+  currencyCode: string;
 }
 
-export interface ShippingZoneChannels_shippingZones_edges {
-  __typename: "ShippingZoneCountableEdge";
-  node: ShippingZoneChannels_shippingZones_edges_node;
-}
-
-export interface ShippingZoneChannels_shippingZones {
-  __typename: "ShippingZoneCountableConnection";
-  edges: ShippingZoneChannels_shippingZones_edges[];
+export interface ShippingZoneChannels_shippingZone {
+  __typename: "ShippingZone";
+  id: string;
+  channels: ShippingZoneChannels_shippingZone_channels[];
 }
 
 export interface ShippingZoneChannels {
-  shippingZones: ShippingZoneChannels_shippingZones | null;
+  shippingZone: ShippingZoneChannels_shippingZone | null;
 }
 
 export interface ShippingZoneChannelsVariables {
-  filter?: ShippingZoneFilterInput | null;
+  id: string;
 }