From 66f6b18539a2ea9c071f2142530edf6b476262d1 Mon Sep 17 00:00:00 2001 From: Chuenwatanakul Date: Tue, 25 Feb 2020 22:53:24 +0700 Subject: [PATCH 1/4] TODO --- README.md | 2 +- deploy.sh | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index b6e4a64..16cee1b 100644 --- a/README.md +++ b/README.md @@ -91,7 +91,7 @@ This may take up to and over an hour to complete, mostly on the deployment of in * GetRecommendations * GetRecommendationsByItem 3. In the environment section and replace the ARN with the one create from jupyter notebook. -4. Goto ``/webui``, Open config.tsx file and edit the following varible +4. Goto ``/webui/src/``, Open [confix.tsx](/webui/src/index.tsx) file and edit the following varible. These varible can be found in cloudformation output. * Apitree * AnonymousPoolId * StreamName diff --git a/deploy.sh b/deploy.sh index cf47353..a754dc6 100755 --- a/deploy.sh +++ b/deploy.sh @@ -75,6 +75,7 @@ sam deploy \ --parameter-overrides BucketName=$SRCS3 ProjectName=$STACKNAME # --disable-rollback +#TODO: edit webui/src/config.tsx to point to the same API echo "Getting web bucket name from stack output..." WEBBUCKETNAME=`aws cloudformation describe-stacks --stack-name $STACKNAME \ From 87f5e1d687e246abe9e27c4689e735ecd6b79e24 Mon Sep 17 00:00:00 2001 From: Chuenwatanakul Date: Tue, 25 Feb 2020 23:19:38 +0700 Subject: [PATCH 2/4] addded SID --- webui/package-lock.json | 55 ++++++++++++++++++- webui/package.json | 7 ++- webui/src/App.tsx | 18 ++++-- .../modules/productDetail/productDetail.tsx | 3 +- 4 files changed, 72 insertions(+), 11 deletions(-) diff --git a/webui/package-lock.json b/webui/package-lock.json index 0f43cd8..bd299db 100644 --- a/webui/package-lock.json +++ b/webui/package-lock.json @@ -12,6 +12,13 @@ "@aws-amplify/cache": "^2.1.1", "@aws-amplify/core": "^2.2.0", "uuid": "^3.2.1" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "@aws-amplify/api": { @@ -36,6 +43,11 @@ "requires": { "iterall": "^1.2.2" } + }, + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" } } }, @@ -154,6 +166,13 @@ "@aws-sdk/eventstream-marshaller": "0.1.0-preview.2", "@aws-sdk/util-utf8-node": "0.1.0-preview.1", "uuid": "^3.2.1" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "@aws-amplify/pubsub": { @@ -178,6 +197,11 @@ "requires": { "iterall": "^1.2.2" } + }, + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" } } }, @@ -1928,6 +1952,12 @@ "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz", "integrity": "sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==" }, + "@types/uuid": { + "version": "3.4.7", + "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-3.4.7.tgz", + "integrity": "sha512-C2j2FWgQkF1ru12SjZJyMaTPxs/f6n90+5G5qNakBxKXjTBc/YTSelHh4Pz1HUDwxFXD9WvpQhOGCDC+/Y4mIQ==", + "dev": true + }, "@types/yargs": { "version": "13.0.3", "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-13.0.3.tgz", @@ -12270,6 +12300,11 @@ "psl": "^1.1.24", "punycode": "^1.4.1" } + }, + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" } } }, @@ -12966,6 +13001,13 @@ "requires": { "faye-websocket": "^0.10.0", "uuid": "^3.0.1" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "sockjs-client": { @@ -14098,9 +14140,9 @@ "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=" }, "uuid": { - "version": "3.3.3", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.3.3.tgz", - "integrity": "sha512-pW0No1RGHgzlpHJO1nsVrHKpOEIxkGg1xB+v0ZmdNH5OAeAwzAVrCnI2/6Mtx+Uys6iaylxa+D3g4j63IKKjSQ==" + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-7.0.0.tgz", + "integrity": "sha512-LNUrNsXdI/fUsypJbWM8Jt4DgQdFAZh41p9C7WE9Cn+CULOEkoG2lgQyH68v3wnIy5K3fN4jdSt270K6IFA3MQ==" }, "v8-compile-cache": { "version": "2.1.0", @@ -14536,6 +14578,13 @@ "requires": { "ansi-colors": "^3.0.0", "uuid": "^3.3.2" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "webpack-manifest-plugin": { diff --git a/webui/package.json b/webui/package.json index 489f3d1..12d16b5 100644 --- a/webui/package.json +++ b/webui/package.json @@ -25,7 +25,8 @@ "react-router-dom": "^5.1.2", "react-scripts": "^3.3.0", "react-uid": "^2.2.0", - "typescript": "^3.2.1" + "typescript": "^3.2.1", + "uuid": "^7.0.0" }, "scripts": { "start": "react-scripts start", @@ -33,7 +34,9 @@ "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" }, - "devDependencies": {}, + "devDependencies": { + "@types/uuid": "^3.4.7" + }, "browserslist": [ ">0.2%", "not dead", diff --git a/webui/src/App.tsx b/webui/src/App.tsx index ef64c59..f989f41 100644 --- a/webui/src/App.tsx +++ b/webui/src/App.tsx @@ -6,6 +6,7 @@ import RecommendationList from "./modules/recommendationList/recommendationList" import notFound from "./modules/notFound/notFound"; import ProductDetail from "./modules/productDetail/productDetail"; import SearchBar from "./modules/searchBar/searchBar"; +import uuid, { v4 as uuidv4 } from 'uuid'; import "./App.css"; const userList = [ @@ -48,7 +49,8 @@ interface User { interface AppState { selectedUser: User | undefined; - userSelectedName : string + userSelectedName : string; + SID : string | null; } class App extends Component, AppState> { @@ -59,12 +61,14 @@ class App extends Component, AppState> { let userobj = JSON.parse(user) this.state = { selectedUser: userobj, - userSelectedName : `${userobj.firstName} ${userobj.lastName}` + userSelectedName : `${userobj.firstName} ${userobj.lastName}`, + SID : localStorage.getItem('SID') }; }else{ this.state = { selectedUser: undefined, - userSelectedName : '' + userSelectedName : '', + SID : null }; } this.renderSelectOptions = this.renderSelectOptions.bind(this); @@ -74,16 +78,20 @@ class App extends Component, AppState> { renderSelectOptions(eventKey : any) { console.log('eventKey',eventKey) + let SID = uuidv4() if(eventKey === 'anonymous'){ this.setState({ userSelectedName: 'anonymous'}); this.setState({ selectedUser: undefined}); + this.setState({ SID: null}); localStorage.removeItem('user'); + localStorage.removeItem('SID'); }else{ this.setState({ userSelectedName: `${userList[eventKey].firstName} ${userList[eventKey].lastName}` }); this.setState({ selectedUser: userList[eventKey]}); localStorage.setItem('user', JSON.stringify(userList[eventKey])); + localStorage.setItem('SID', SID); } } @@ -110,9 +118,9 @@ class App extends Component, AppState> {