diff --git a/front/.gitignore b/front/.gitignore
index b5fa49a..ab36df1 100644
--- a/front/.gitignore
+++ b/front/.gitignore
@@ -10,5 +10,8 @@ npm-debug.*
*.orig.*
web-build/
*.apk
+yarn.error*
# macOS
.DS_Store
+
+.idea/
diff --git a/front/App.test.tsx b/front/App.test.tsx
index c011b2c..5fadc03 100644
--- a/front/App.test.tsx
+++ b/front/App.test.tsx
@@ -1,11 +1,11 @@
import React from 'react';
-import renderer from 'react-test-renderer';
+import TestRenderer from 'react-test-renderer';
import App from './App';
describe('', () => {
it('has 1 child', () => {
- const tree = renderer.create().toJSON();
- expect(tree.children.length).toBe(1);
+ const tree = TestRenderer.create().toJSON();
+ expect(tree.children.length).toBe(10);
});
});
diff --git a/front/App.tsx b/front/App.tsx
index 0329d0c..1bbcd7d 100644
--- a/front/App.tsx
+++ b/front/App.tsx
@@ -1,10 +1,32 @@
import { StatusBar } from 'expo-status-bar';
-import { StyleSheet, Text, View } from 'react-native';
+import { StyleSheet, Text, View, ColorValue } from 'react-native';
+import ColorTheme from './Theme';
+
+const ExampleBox = (props: { textColor: ColorValue, backgroundColor: ColorValue }) => (
+
+ Hello
+
+)
export default function App() {
return (
- Open up App.tsx to start working on your app!
+
+
+
+
+
+
+
+
+
+
);
@@ -13,8 +35,7 @@ export default function App() {
const styles = StyleSheet.create({
container: {
flex: 1,
- backgroundColor: '#fff',
- alignItems: 'center',
+ backgroundColor: ColorTheme.backgroundDark,
justifyContent: 'center',
},
});
diff --git a/front/Theme.tsx b/front/Theme.tsx
new file mode 100644
index 0000000..010fd76
--- /dev/null
+++ b/front/Theme.tsx
@@ -0,0 +1,31 @@
+/**
+ * Color theme to use thoughout the application
+ * Using the Material Color guidelines
+ * TODO: integrate with the to-be-determined design framework
+ */
+const ColorTheme = {
+ primary: '#5db075',
+ primaryVariant: '#008000',
+ onPrimary: '#ffffff',
+
+ secondary: '#00bdbd',
+ secondaryVariant: '#008b8c',
+ onSecondary: '#ffffff',
+
+ backgroundLight: '#F0F0F0',
+ onBackgroundLight: '#000000',
+ backgroundDark: '#292929',
+ onBackgroundDark: '#FFFFFF',
+
+ surface: '#F6F6F6',
+ onSurface: '#000000',
+
+ placeholder: '#C9C9C9',
+
+ error: '#B00020',
+ onError: '#FFFFFF',
+
+ divider: "#DDDDDD",
+};
+
+export default ColorTheme;
\ No newline at end of file
diff --git a/front/package.json b/front/package.json
index f6dc2ef..e80338a 100644
--- a/front/package.json
+++ b/front/package.json
@@ -13,6 +13,8 @@
"test:watch": "jest -i --watch"
},
"dependencies": {
+ "@types/jest": "^28.1.4",
+ "@types/react-test-renderer": "^18.0.0",
"expo": "~45.0.0",
"expo-dev-client": "~1.0.0",
"expo-status-bar": "~1.3.0",
@@ -27,7 +29,7 @@
"@babel/core": "^7.12.9",
"@types/react": "~17.0.21",
"@types/react-native": "~0.66.13",
- "react-test-renderer": "17",
+ "react-test-renderer": "17.0.2",
"typescript": "~4.3.5"
},
"private": true,
diff --git a/front/yarn.lock b/front/yarn.lock
index a39f85f..eacd497 100644
--- a/front/yarn.lock
+++ b/front/yarn.lock
@@ -1549,6 +1549,13 @@
optionalDependencies:
node-notifier "^8.0.0"
+"@jest/schemas@^28.0.2":
+ version "28.0.2"
+ resolved "https://registry.yarnpkg.com/@jest/schemas/-/schemas-28.0.2.tgz#08c30df6a8d07eafea0aef9fb222c5e26d72e613"
+ integrity sha512-YVDJZjd4izeTDkij00vHHAymNXQ6WWsdChFRK86qck6Jpr3DCL5W3Is3vslviRlP+bLuMYRLbdp98amMvqudhA==
+ dependencies:
+ "@sinclair/typebox" "^0.23.3"
+
"@jest/source-map@^26.6.2":
version "26.6.2"
resolved "https://registry.yarnpkg.com/@jest/source-map/-/source-map-26.6.2.tgz#29af5e1e2e324cafccc936f218309f54ab69d535"
@@ -1918,6 +1925,11 @@
resolved "https://registry.yarnpkg.com/@sideway/pinpoint/-/pinpoint-2.0.0.tgz#cff8ffadc372ad29fd3f78277aeb29e632cc70df"
integrity sha512-RNiOoTPkptFtSVzQevY/yWtZwf/RxyVnPy/OcA9HBM3MlGDnBEYL5B41H0MTn0Uec8Hi+2qUtTfG2WWZBmMejQ==
+"@sinclair/typebox@^0.23.3":
+ version "0.23.5"
+ resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.23.5.tgz#93f7b9f4e3285a7a9ade7557d9a8d36809cbc47d"
+ integrity sha512-AFBVi/iT4g20DHoujvMH1aEDn8fGJh4xsRGCP6d8RpLPMqsNPvW01Jcn0QysXTsg++/xj25NmJsGyH9xug/wKg==
+
"@sinonjs/commons@^1.7.0":
version "1.8.3"
resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.8.3.tgz#3802ddd21a50a949b6721ddd72da36e67e7f1b2d"
@@ -1996,6 +2008,14 @@
dependencies:
"@types/istanbul-lib-report" "*"
+"@types/jest@^28.1.4":
+ version "28.1.4"
+ resolved "https://registry.yarnpkg.com/@types/jest/-/jest-28.1.4.tgz#a11ee6c8fd0b52c19c9c18138b78bbcc201dad5a"
+ integrity sha512-telv6G5N7zRJiLcI3Rs3o+ipZ28EnE+7EvF0pSrt2pZOMnAVI/f+6/LucDxOvcBcTeTL3JMF744BbVQAVBUQRA==
+ dependencies:
+ jest-matcher-utils "^28.0.0"
+ pretty-format "^28.0.0"
+
"@types/node@*":
version "18.0.0"
resolved "https://registry.yarnpkg.com/@types/node/-/node-18.0.0.tgz#67c7b724e1bcdd7a8821ce0d5ee184d3b4dd525a"
@@ -2023,6 +2043,13 @@
dependencies:
"@types/react" "*"
+"@types/react-test-renderer@^18.0.0":
+ version "18.0.0"
+ resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-18.0.0.tgz#7b7f69ca98821ea5501b21ba24ea7b6139da2243"
+ integrity sha512-C7/5FBJ3g3sqUahguGi03O79b8afNeSD6T8/GU50oQrJCU0bVCCGQHaGKUbg2Ce8VQEEqTw8/HiS6lXHHdgkdQ==
+ dependencies:
+ "@types/react" "*"
+
"@types/react@*":
version "18.0.14"
resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.14.tgz#e016616ffff51dba01b04945610fe3671fdbe06d"
@@ -3354,6 +3381,11 @@ diff-sequences@^26.6.2:
resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-26.6.2.tgz#48ba99157de1923412eed41db6b6d4aa9ca7c0b1"
integrity sha512-Mv/TDa3nZ9sbc5soK+OoA74BsS3mL37yixCvUAQkiuA4Wz6YtwP/K47n2rv2ovzHZvoiQeA5FTQOschKkEwB0Q==
+diff-sequences@^28.1.1:
+ version "28.1.1"
+ resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-28.1.1.tgz#9989dc731266dc2903457a70e996f3a041913ac6"
+ integrity sha512-FU0iFaH/E23a+a718l8Qa/19bF9p06kgE0KipMOMadwa3SjnaElKzPaUC0vnibs6/B/9ni97s61mcejk8W1fQw==
+
dir-glob@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f"
@@ -4770,6 +4802,16 @@ jest-diff@^26.6.2:
jest-get-type "^26.3.0"
pretty-format "^26.6.2"
+jest-diff@^28.1.1:
+ version "28.1.1"
+ resolved "https://registry.yarnpkg.com/jest-diff/-/jest-diff-28.1.1.tgz#1a3eedfd81ae79810931c63a1d0f201b9120106c"
+ integrity sha512-/MUUxeR2fHbqHoMMiffe/Afm+U8U4olFRJ0hiVG2lZatPJcnGxx292ustVu7bULhjV65IYMxRdploAKLbcrsyg==
+ dependencies:
+ chalk "^4.0.0"
+ diff-sequences "^28.1.1"
+ jest-get-type "^28.0.2"
+ pretty-format "^28.1.1"
+
jest-docblock@^26.0.0:
version "26.0.0"
resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-26.0.0.tgz#3e2fa20899fc928cb13bd0ff68bd3711a36889b5"
@@ -4833,6 +4875,11 @@ jest-get-type@^26.3.0:
resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-26.3.0.tgz#e97dc3c3f53c2b406ca7afaed4493b1d099199e0"
integrity sha512-TpfaviN1R2pQWkIihlfEanwOXK0zcxrKEE4MlU6Tn7keoXdN6/3gK/xl0yEh8DOunn5pOVGKf8hB4R9gVh04ig==
+jest-get-type@^28.0.2:
+ version "28.0.2"
+ resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-28.0.2.tgz#34622e628e4fdcd793d46db8a242227901fcf203"
+ integrity sha512-ioj2w9/DxSYHfOm5lJKCdcAmPJzQXmbM/Url3rhlghrPvT3tt+7a/+oXc9azkKmLvoiXjtV83bEWqi+vs5nlPA==
+
jest-haste-map@^26.6.2:
version "26.6.2"
resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-26.6.2.tgz#dd7e60fe7dc0e9f911a23d79c5ff7fb5c2cafeaa"
@@ -4916,6 +4963,16 @@ jest-matcher-utils@^26.6.2:
jest-get-type "^26.3.0"
pretty-format "^26.6.2"
+jest-matcher-utils@^28.0.0:
+ version "28.1.1"
+ resolved "https://registry.yarnpkg.com/jest-matcher-utils/-/jest-matcher-utils-28.1.1.tgz#a7c4653c2b782ec96796eb3088060720f1e29304"
+ integrity sha512-NPJPRWrbmR2nAJ+1nmnfcKKzSwgfaciCCrYZzVnNoxVoyusYWIjkBMNvu0RHJe7dNj4hH3uZOPZsQA+xAYWqsw==
+ dependencies:
+ chalk "^4.0.0"
+ jest-diff "^28.1.1"
+ jest-get-type "^28.0.2"
+ pretty-format "^28.1.1"
+
jest-message-util@^26.6.2:
version "26.6.2"
resolved "https://registry.yarnpkg.com/jest-message-util/-/jest-message-util-26.6.2.tgz#58173744ad6fc0506b5d21150b9be56ef001ca07"
@@ -6572,6 +6629,16 @@ pretty-format@^27.5.1:
ansi-styles "^5.0.0"
react-is "^17.0.1"
+pretty-format@^28.0.0, pretty-format@^28.1.1:
+ version "28.1.1"
+ resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-28.1.1.tgz#f731530394e0f7fcd95aba6b43c50e02d86b95cb"
+ integrity sha512-wwJbVTGFHeucr5Jw2bQ9P+VYHyLdAqedFLEkdQUVaBF/eiidDwH5OpilINq4mEfhbCjLnirt6HTTDhv1HaTIQw==
+ dependencies:
+ "@jest/schemas" "^28.0.2"
+ ansi-regex "^5.0.1"
+ ansi-styles "^5.0.0"
+ react-is "^18.0.0"
+
process-nextick-args@~2.0.0:
version "2.0.1"
resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
@@ -6703,7 +6770,7 @@ react-dom@17.0.2:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
-"react-is@^16.12.0 || ^17.0.0 || ^18.0.0":
+"react-is@^16.12.0 || ^17.0.0 || ^18.0.0", react-is@^18.0.0:
version "18.2.0"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
@@ -6800,7 +6867,7 @@ react-shallow-renderer@^16.13.1:
object-assign "^4.1.1"
react-is "^16.12.0 || ^17.0.0 || ^18.0.0"
-react-test-renderer@17, react-test-renderer@~17.0.2:
+react-test-renderer@17.0.2, react-test-renderer@~17.0.2:
version "17.0.2"
resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-17.0.2.tgz#4cd4ae5ef1ad5670fc0ef776e8cc7e1231d9866c"
integrity sha512-yaQ9cB89c17PUb0x6UfWRs7kQCorVdHlutU1boVPEsB8IDZH6n9tHxMacc3y0JoXOJUsZb/t/Mb8FUWMKaM7iQ==