diff --git a/App.tsx b/App.tsx index 0a1aabd..0220386 100644 --- a/App.tsx +++ b/App.tsx @@ -1,25 +1,32 @@ -import {StatusBar} from 'expo-status-bar'; -import {StyleSheet, View} from 'react-native'; -import {DocumentRenderer} from '@keystone-6/document-renderer'; -import {renderers} from "./Renderers"; +import React, {useEffect, useState} from 'react'; +import {AppRegistry} from 'react-native'; +import {ApolloProvider} from '@apollo/client'; +import {client, getPlanData} from "./db"; +import Slide from "./Slide"; -const json = require('./data.json') -const document = json['data']['slides'][0]['content']['document'] +const App = () => { + const [slides, setSlides] = useState([]) + useEffect(() => { + getPlanData().then(d => { + const plans = d.data.plans + //console.log(plans) -export default function App() { - return ( - - - - - ); -} + const sections = plans.map(plan => plan.sections).flat() + //console.log(sections) -const styles = StyleSheet.create({ - container: { - flex: 1, - backgroundColor: '#fff', - alignItems: 'center', - justifyContent: 'center' - }, -}); + const slides = sections.map(section => section.slides).flat() + //console.log(slides) + setSlides(slides) + }) + }, [slides]) + + return + {slides && slides.map((slide, idx) => { + return + })} + +}; + +AppRegistry.registerComponent('MyApplication', () => App); + +export default App; \ No newline at end of file diff --git a/Slide.tsx b/Slide.tsx new file mode 100644 index 0000000..05357ec --- /dev/null +++ b/Slide.tsx @@ -0,0 +1,52 @@ +import {StatusBar} from 'expo-status-bar'; +import {StyleSheet, View} from 'react-native'; +import {DocumentRenderer} from '@keystone-6/document-renderer'; +import {renderers} from "./Renderers"; +import React from 'react'; + + +//const json = require('./data.json') +//const document = json['data']['slides'][0]['content']['document'] + +interface SlideProps { + sequence: number, + document: any +} + +export default function Slide({sequence, document}: SlideProps) { + return ( + + + {sequence} + + + + + + + ); +} + +const styles = StyleSheet.create({ + container: { + margin: '50px', + padding: '10px', + border: '1px solid black' + }, + sequence: { + padding: '10px' + }, + slide: { + flex: 1, + padding: '10px', + backgroundColor: '#fff', + alignItems: 'center', + justifyContent: 'center', + }, + content: { + flex: 1, + backgroundColor: '#fff', + alignItems: 'center', + justifyContent: 'center', + }, +}); diff --git a/db.ts b/db.ts new file mode 100644 index 0000000..b0c667c --- /dev/null +++ b/db.ts @@ -0,0 +1,37 @@ +import {ApolloClient, gql, InMemoryCache} from "@apollo/client"; + +const remote = 'reach out!' + +// Initialize Apollo Client +export const client = new ApolloClient({ + uri: remote, + cache: new InMemoryCache() +}); + +export const getPlanData = () => { + return client + .query({ + query: gql` + query getPlans { + plans(where:{id: {equals: "cl1ccg4il01060mwkcejaj5ia"}}) { + sections { + id, + sequence, + name, + slides { + id, + sequence, + image { + url + }, + imagePlacement, + content { + document + } + } + } + } +} + ` + }) +} \ No newline at end of file diff --git a/metro.config.js b/metro.config.js new file mode 100644 index 0000000..d311173 --- /dev/null +++ b/metro.config.js @@ -0,0 +1,9 @@ +const { getDefaultConfig } = require("metro-config"); +const { resolver: defaultResolver } = getDefaultConfig.getDefaultValues(); +exports.resolver = { + ...defaultResolver, + sourceExts: [ + ...defaultResolver.sourceExts, + "cjs", + ], +}; \ No newline at end of file diff --git a/package.json b/package.json index 0995319..612ef5b 100644 --- a/package.json +++ b/package.json @@ -10,9 +10,11 @@ "eject": "expo eject" }, "dependencies": { + "@apollo/client": "^3.5.10", "@keystone-6/document-renderer": "^1.0.0", "expo": "~44.0.0", "expo-status-bar": "~1.2.0", + "graphql": "^16.3.0", "react": "17.0.1", "react-dom": "17.0.1", "react-native": "0.64.3", diff --git a/tsconfig.json b/tsconfig.json index b9567f6..7886cc1 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,7 @@ { "extends": "expo/tsconfig.base", "compilerOptions": { + "jsx": "react", "strict": true } } diff --git a/yarn.lock b/yarn.lock index 6e6c8bf..73e40f0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9,6 +9,24 @@ dependencies: "@jridgewell/trace-mapping" "^0.3.0" +"@apollo/client@^3.5.10": + version "3.5.10" + resolved "https://registry.yarnpkg.com/@apollo/client/-/client-3.5.10.tgz#43463108a6e07ae602cca0afc420805a19339a71" + integrity sha512-tL3iSpFe9Oldq7gYikZK1dcYxp1c01nlSwtsMz75382HcI6fvQXyFXUCJTTK3wgO2/ckaBvRGw7VqjFREdVoRw== + dependencies: + "@graphql-typed-document-node/core" "^3.0.0" + "@wry/context" "^0.6.0" + "@wry/equality" "^0.5.0" + "@wry/trie" "^0.3.0" + graphql-tag "^2.12.3" + hoist-non-react-statics "^3.3.2" + optimism "^0.16.1" + prop-types "^15.7.2" + symbol-observable "^4.0.0" + ts-invariant "^0.9.4" + tslib "^2.3.0" + zen-observable-ts "^1.2.0" + "@babel/code-frame@^7.0.0", "@babel/code-frame@^7.16.7": version "7.16.7" resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.7.tgz#44416b6bd7624b998f5b1af5d470856c40138789" @@ -1212,6 +1230,11 @@ lodash.pick "^4.4.0" lodash.template "^4.5.0" +"@graphql-typed-document-node/core@^3.0.0": + version "3.1.1" + resolved "https://registry.yarnpkg.com/@graphql-typed-document-node/core/-/core-3.1.1.tgz#076d78ce99822258cf813ecc1e7fa460fa74d052" + integrity sha512-NQ17ii0rK1b34VZonlmT2QMJFI70m0TRwbknO/ihlbatXyaktDhN/98vBiUU6kNBPljqGqyIrl2T4nY2RpFANg== + "@hapi/hoek@^9.0.0": version "9.2.1" resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-9.2.1.tgz#9551142a1980503752536b5050fd99f4a7f13b17" @@ -1516,6 +1539,27 @@ dependencies: "@types/yargs-parser" "*" +"@wry/context@^0.6.0": + version "0.6.1" + resolved "https://registry.yarnpkg.com/@wry/context/-/context-0.6.1.tgz#c3c29c0ad622adb00f6a53303c4f965ee06ebeb2" + integrity sha512-LOmVnY1iTU2D8tv4Xf6MVMZZ+juIJ87Kt/plMijjN20NMAXGmH4u8bS1t0uT74cZ5gwpocYueV58YwyI8y+GKw== + dependencies: + tslib "^2.3.0" + +"@wry/equality@^0.5.0": + version "0.5.2" + resolved "https://registry.yarnpkg.com/@wry/equality/-/equality-0.5.2.tgz#72c8a7a7d884dff30b612f4f8464eba26c080e73" + integrity sha512-oVMxbUXL48EV/C0/M7gLVsoK6qRHPS85x8zECofEZOVvxGmIPLA9o5Z27cc2PoAyZz1S2VoM2A7FLAnpfGlneA== + dependencies: + tslib "^2.3.0" + +"@wry/trie@^0.3.0": + version "0.3.1" + resolved "https://registry.yarnpkg.com/@wry/trie/-/trie-0.3.1.tgz#2279b790f15032f8bcea7fc944d27988e5b3b139" + integrity sha512-WwB53ikYudh9pIorgxrkHKrQZcCqNM/Q/bDzZBffEaGUKGuHrRb3zZUT9Sh2qw9yogC7SsdRmQ1ER0pqvd3bfw== + dependencies: + tslib "^2.3.0" + "@xmldom/xmldom@~0.7.0": version "0.7.5" resolved "https://registry.yarnpkg.com/@xmldom/xmldom/-/xmldom-0.7.5.tgz#09fa51e356d07d0be200642b0e4f91d8e6dd408d" @@ -2897,6 +2941,18 @@ graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.6, resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96" integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ== +graphql-tag@^2.12.3: + version "2.12.6" + resolved "https://registry.yarnpkg.com/graphql-tag/-/graphql-tag-2.12.6.tgz#d441a569c1d2537ef10ca3d1633b48725329b5f1" + integrity sha512-FdSNcu2QQcWnM2VNvSCCDCVS5PpPqpzgFT8+GXzqJuoDd0CBncxCY278u4mhRO7tMgo2JjgJA5aZ+nWSQ/Z+xg== + dependencies: + tslib "^2.1.0" + +graphql@^16.3.0: + version "16.3.0" + resolved "https://registry.yarnpkg.com/graphql/-/graphql-16.3.0.tgz#a91e24d10babf9e60c706919bb182b53ccdffc05" + integrity sha512-xm+ANmA16BzCT5pLjuXySbQVFwH3oJctUVdy81w1sV0vBU0KgDdBGtxQOUd5zqOBk/JayAFeG8Dlmeq74rjm/A== + has-flag@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd" @@ -2962,6 +3018,13 @@ hermes-profile-transformer@^0.0.6: dependencies: source-map "^0.7.3" +hoist-non-react-statics@^3.3.2: + version "3.3.2" + resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" + integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== + dependencies: + react-is "^16.7.0" + http-errors@1.8.1: version "1.8.1" resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.8.1.tgz#7c3f28577cbc8a207388455dbd62295ed07bd68c" @@ -4159,6 +4222,14 @@ open@^6.2.0: dependencies: is-wsl "^1.1.0" +optimism@^0.16.1: + version "0.16.1" + resolved "https://registry.yarnpkg.com/optimism/-/optimism-0.16.1.tgz#7c8efc1f3179f18307b887e18c15c5b7133f6e7d" + integrity sha512-64i+Uw3otrndfq5kaoGNoY7pvOhSsjFEN4bdEFh80MWVk/dbgJfMv7VFDeCT8LxNAlEVhQmdVEbfE7X2nWNIIg== + dependencies: + "@wry/context" "^0.6.0" + "@wry/trie" "^0.3.0" + options@>=0.0.5: version "0.0.6" resolved "https://registry.yarnpkg.com/options/-/options-0.0.6.tgz#ec22d312806bb53e731773e7cdaefcf1c643128f" @@ -4407,7 +4478,7 @@ react-dom@17.0.1: object-assign "^4.1.1" scheduler "^0.20.1" -react-is@^16.13.1: +react-is@^16.13.1, react-is@^16.7.0: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== @@ -5083,6 +5154,11 @@ supports-preserve-symlinks-flag@^1.0.0: resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09" integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w== +symbol-observable@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-4.0.0.tgz#5b425f192279e87f2f9b937ac8540d1984b39205" + integrity sha512-b19dMThMV4HVFynSAM1++gBHAbk2Tc/osgLIBZMKsyqh34jb2e8Os7T6ZW/Bt3pJFdBTd2JwAnAAEQV7rSNvcQ== + temp@0.8.3: version "0.8.3" resolved "https://registry.yarnpkg.com/temp/-/temp-0.8.3.tgz#e0c6bc4d26b903124410e4fed81103014dfc1f59" @@ -5182,7 +5258,14 @@ ts-interface-checker@^0.1.9: resolved "https://registry.yarnpkg.com/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz#784fd3d679722bc103b1b4b8030bcddb5db2a699" integrity sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA== -tslib@^2.0.1: +ts-invariant@^0.9.4: + version "0.9.4" + resolved "https://registry.yarnpkg.com/ts-invariant/-/ts-invariant-0.9.4.tgz#42ac6c791aade267dd9dc65276549df5c5d71cac" + integrity sha512-63jtX/ZSwnUNi/WhXjnK8kz4cHHpYS60AnmA6ixz17l7E12a5puCWFlNpkne5Rl0J8TBPVHpGjsj4fxs8ObVLQ== + dependencies: + tslib "^2.1.0" + +tslib@^2.0.1, tslib@^2.1.0, tslib@^2.3.0: version "2.3.1" resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01" integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw== @@ -5508,3 +5591,15 @@ yocto-queue@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b" integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q== + +zen-observable-ts@^1.2.0: + version "1.2.3" + resolved "https://registry.yarnpkg.com/zen-observable-ts/-/zen-observable-ts-1.2.3.tgz#c2f5ccebe812faf0cfcde547e6004f65b1a6d769" + integrity sha512-hc/TGiPkAWpByykMwDcem3SdUgA4We+0Qb36bItSuJC9xD0XVBZoFHYoadAomDSNf64CG8Ydj0Qb8Od8BUWz5g== + dependencies: + zen-observable "0.8.15" + +zen-observable@0.8.15: + version "0.8.15" + resolved "https://registry.yarnpkg.com/zen-observable/-/zen-observable-0.8.15.tgz#96415c512d8e3ffd920afd3889604e30b9eaac15" + integrity sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ==