1 | import React, { Component } from 'react';
|
2 | import { Platform, Text, View } from 'react-native';
|
3 |
|
4 | import {
|
5 | default as withProductDetailData,
|
6 | WithProductDetailProps,
|
7 | WithProductDetailProviderProps
|
8 | } from './ProductDetailProvider';
|
9 |
|
10 | import {
|
11 | CommerceDataSource,
|
12 | CommerceTypes
|
13 | } from '@brandingbrand/fscommerce';
|
14 |
|
15 | export interface UnwrappedProductDetailProps {
|
16 | id: string;
|
17 | }
|
18 |
|
19 | export type ProductDetailProduct = CommerceTypes.Product;
|
20 | export type ProductDetailProps = UnwrappedProductDetailProps & WithProductDetailProviderProps;
|
21 |
|
22 | class ProductDetail extends Component<UnwrappedProductDetailProps & WithProductDetailProps> {
|
23 | render(): JSX.Element {
|
24 | const data = JSON.stringify(this.props.commerceData, null, 2);
|
25 | if (Platform.OS === 'web') {
|
26 | return <pre>{data}</pre>;
|
27 | } else {
|
28 | return (
|
29 | <View>
|
30 | <Text>{data}</Text>
|
31 | </View>
|
32 | );
|
33 | }
|
34 | }
|
35 | }
|
36 |
|
37 | export default withProductDetailData<UnwrappedProductDetailProps>(
|
38 | async (DataSource: CommerceDataSource, props: UnwrappedProductDetailProps) => {
|
39 | return DataSource.fetchProduct(props.id);
|
40 | }
|
41 | )(ProductDetail);
|