UBC/Alley-HSBC-Frontend
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #45 from CPSC319-Winter-term-2/api-fetch

Browse Source 
Api fetch
This commit is contained in:
cth0604 2022-03-25 13:18:46 -07:00 committed by GitHub
commit 63f2a293f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 445 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

225
package-lock.json generated
View File

@ -20,7 +20,8 @@
"react-big-calendar": "^0.39.3",
"react-dom": "^17.0.2",
"react-redux": "^7.2.6",
"react-router-dom": "^6.2.1"
"react-router-dom": "^6.2.1",
"socket.io-client": "^4.4.1"
},
"devDependencies": {
"@svgr/webpack": "^5.5.0",
@ -2255,6 +2256,19 @@
"node": ">=4"
}
},
"node_modules/@socket.io/base64-arraybuffer": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@socket.io/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
"integrity": "sha512-dOlCBKnDw4iShaIsH/bxujKTM18+2TOAsYz+KSc11Am38H4q5Xw8Bbz97ZYdrVNM+um3p7w86Bvvmcn9q+5+eQ==",
"engines": {
"node": ">= 0.6.0"
}
},
"node_modules/@socket.io/component-emitter": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.0.0.tgz",
"integrity": "sha512-2pTGuibAXJswAPJjaKisthqS/NOK5ypG4LYT6tEAV0S/mxW0zOIvYvGK0V8w8+SHxAm6vRMSjqSalFXeBAqs+Q=="
},
"node_modules/@svgr/babel-plugin-add-jsx-attribute": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-5.4.0.tgz",
@ -3604,6 +3618,11 @@
"@babel/core": "^7.0.0-0"
}
},
"node_modules/backo2": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
"integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
},
"node_modules/balanced-match": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@ -4634,6 +4653,7 @@
"dependencies": {
"anymatch": "~3.1.2",
"braces": "~3.0.2",
"fsevents": "~2.3.2",
"glob-parent": "~5.1.2",
"is-binary-path": "~2.1.0",
"is-glob": "~4.0.1",
@ -5897,6 +5917,53 @@
"once": "^1.4.0"
}
},
"node_modules/engine.io-client": {
"version": "6.1.1",
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.1.1.tgz",
"integrity": "sha512-V05mmDo4gjimYW+FGujoGmmmxRaDsrVr7AXA3ZIfa04MWM1jOfZfUwou0oNqhNwy/votUDvGDt4JA4QF4e0b4g==",
"dependencies": {
"@socket.io/component-emitter": "~3.0.0",
"debug": "~4.3.1",
"engine.io-parser": "~5.0.0",
"has-cors": "1.1.0",
"parseqs": "0.0.6",
"parseuri": "0.0.6",
"ws": "~8.2.3",
"xmlhttprequest-ssl": "~2.0.0",
"yeast": "0.1.2"
}
},
"node_modules/engine.io-client/node_modules/ws": {
"version": "8.2.3",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.2.3.tgz",
"integrity": "sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA==",
"engines": {
"node": ">=10.0.0"
},
"peerDependencies": {
"bufferutil": "^4.0.1",
"utf-8-validate": "^5.0.2"
},
"peerDependenciesMeta": {
"bufferutil": {
"optional": true
},
"utf-8-validate": {
"optional": true
}
}
},
"node_modules/engine.io-parser": {
"version": "5.0.3",
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.0.3.tgz",
"integrity": "sha512-BtQxwF27XUNnSafQLvDi0dQ8s3i6VgzSoQMJacpIcGNrlUdfHSKbgm3jmjCVvQluGzqwujQMPAoMai3oYSTurg==",
"dependencies": {
"@socket.io/base64-arraybuffer": "~1.0.2"
},
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/enhanced-resolve": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.5.0.tgz",
@ -7430,6 +7497,11 @@
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/has-cors": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
"integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
},
"node_modules/has-flag": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@ -7787,6 +7859,12 @@
"dev": true,
"dependencies": {
"imagemin": "^7.0.1",
"imagemin-gifsicle": "^7.0.0",
"imagemin-mozjpeg": "^9.0.0",
"imagemin-optipng": "^8.0.0",
"imagemin-pngquant": "^9.0.2",
"imagemin-svgo": "^9.0.0",
"imagemin-webp": "^7.0.0",
"loader-utils": "^2.0.0",
"object-assign": "^4.1.1",
"schema-utils": "^2.7.1"
@ -10017,6 +10095,16 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/parseqs": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.6.tgz",
"integrity": "sha512-jeAGzMDbfSHHA091hr0r31eYfTig+29g3GKKE/PPbEQ65X0lmMwlEoqmhzu0iztID5uJpZsFlUPDP8ThPL7M8w=="
},
"node_modules/parseuri": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.6.tgz",
"integrity": "sha512-AUjen8sAkGgao7UyCX6Ahv0gIK2fABKmYjvP4xmy5JaKvcbTRueIqIPHLAfq30xJddqSE033IOMUSOMCcK3Sow=="
},
"node_modules/parseurl": {
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@ -11426,6 +11514,34 @@
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"dev": true
},
"node_modules/socket.io-client": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.4.1.tgz",
"integrity": "sha512-N5C/L5fLNha5Ojd7Yeb/puKcPWWcoB/A09fEjjNsg91EDVr5twk/OEyO6VT9dlLSUNY85NpW6KBhVMvaLKQ3vQ==",
"dependencies": {
"@socket.io/component-emitter": "~3.0.0",
"backo2": "~1.0.2",
"debug": "~4.3.2",
"engine.io-client": "~6.1.1",
"parseuri": "0.0.6",
"socket.io-parser": "~4.1.1"
},
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/socket.io-parser": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.1.2.tgz",
"integrity": "sha512-j3kk71QLJuyQ/hh5F/L2t1goqzdTL0gvDzuhTuNSwihfuFUrcSji0qFZmJJPtG6Rmug153eOPsUizeirf1IIog==",
"dependencies": {
"@socket.io/component-emitter": "~3.0.0",
"debug": "~4.3.1"
},
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/sockjs": {
"version": "0.3.24",
"resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
@ -12971,6 +13087,14 @@
}
}
},
"node_modules/xmlhttprequest-ssl": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz",
"integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/xtend": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
@ -13006,6 +13130,11 @@
"fd-slicer": "~1.1.0"
}
},
"node_modules/yeast": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
"integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
},
"node_modules/yn": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
@ -14491,6 +14620,16 @@
"dev": true,
"optional": true
},
"@socket.io/base64-arraybuffer": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@socket.io/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
"integrity": "sha512-dOlCBKnDw4iShaIsH/bxujKTM18+2TOAsYz+KSc11Am38H4q5Xw8Bbz97ZYdrVNM+um3p7w86Bvvmcn9q+5+eQ=="
},
"@socket.io/component-emitter": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.0.0.tgz",
"integrity": "sha512-2pTGuibAXJswAPJjaKisthqS/NOK5ypG4LYT6tEAV0S/mxW0zOIvYvGK0V8w8+SHxAm6vRMSjqSalFXeBAqs+Q=="
},
"@svgr/babel-plugin-add-jsx-attribute": {
"version": "5.4.0",
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-5.4.0.tgz",
@ -15535,6 +15674,11 @@
"@babel/helper-define-polyfill-provider": "^0.3.1"
}
},
"backo2": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
"integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
},
"balanced-match": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@ -17335,6 +17479,38 @@
"once": "^1.4.0"
}
},
"engine.io-client": {
"version": "6.1.1",
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.1.1.tgz",
"integrity": "sha512-V05mmDo4gjimYW+FGujoGmmmxRaDsrVr7AXA3ZIfa04MWM1jOfZfUwou0oNqhNwy/votUDvGDt4JA4QF4e0b4g==",
"requires": {
"@socket.io/component-emitter": "~3.0.0",
"debug": "~4.3.1",
"engine.io-parser": "~5.0.0",
"has-cors": "1.1.0",
"parseqs": "0.0.6",
"parseuri": "0.0.6",
"ws": "~8.2.3",
"xmlhttprequest-ssl": "~2.0.0",
"yeast": "0.1.2"
},
"dependencies": {
"ws": {
"version": "8.2.3",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.2.3.tgz",
"integrity": "sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA==",
"requires": {}
}
}
},
"engine.io-parser": {
"version": "5.0.3",
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.0.3.tgz",
"integrity": "sha512-BtQxwF27XUNnSafQLvDi0dQ8s3i6VgzSoQMJacpIcGNrlUdfHSKbgm3jmjCVvQluGzqwujQMPAoMai3oYSTurg==",
"requires": {
"@socket.io/base64-arraybuffer": "~1.0.2"
}
},
"enhanced-resolve": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.5.0.tgz",
@ -18505,6 +18681,11 @@
"integrity": "sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA==",
"dev": true
},
"has-cors": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
"integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
},
"has-flag": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
@ -20404,6 +20585,16 @@
"lines-and-columns": "^1.1.6"
}
},
"parseqs": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.6.tgz",
"integrity": "sha512-jeAGzMDbfSHHA091hr0r31eYfTig+29g3GKKE/PPbEQ65X0lmMwlEoqmhzu0iztID5uJpZsFlUPDP8ThPL7M8w=="
},
"parseuri": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.6.tgz",
"integrity": "sha512-AUjen8sAkGgao7UyCX6Ahv0gIK2fABKmYjvP4xmy5JaKvcbTRueIqIPHLAfq30xJddqSE033IOMUSOMCcK3Sow=="
},
"parseurl": {
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@ -21502,6 +21693,28 @@
}
}
},
"socket.io-client": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.4.1.tgz",
"integrity": "sha512-N5C/L5fLNha5Ojd7Yeb/puKcPWWcoB/A09fEjjNsg91EDVr5twk/OEyO6VT9dlLSUNY85NpW6KBhVMvaLKQ3vQ==",
"requires": {
"@socket.io/component-emitter": "~3.0.0",
"backo2": "~1.0.2",
"debug": "~4.3.2",
"engine.io-client": "~6.1.1",
"parseuri": "0.0.6",
"socket.io-parser": "~4.1.1"
}
},
"socket.io-parser": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.1.2.tgz",
"integrity": "sha512-j3kk71QLJuyQ/hh5F/L2t1goqzdTL0gvDzuhTuNSwihfuFUrcSji0qFZmJJPtG6Rmug153eOPsUizeirf1IIog==",
"requires": {
"@socket.io/component-emitter": "~3.0.0",
"debug": "~4.3.1"
}
},
"sockjs": {
"version": "0.3.24",
"resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
@ -22643,6 +22856,11 @@
"dev": true,
"requires": {}
},
"xmlhttprequest-ssl": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz",
"integrity": "sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A=="
},
"xtend": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
@ -22672,6 +22890,11 @@
"fd-slicer": "~1.1.0"
}
},
"yeast": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
"integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
},
"yn": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",

3
package.json
View File

@ -20,7 +20,8 @@
"react-big-calendar": "^0.39.3",
"react-dom": "^17.0.2",
"react-redux": "^7.2.6",
"react-router-dom": "^6.2.1"
"react-router-dom": "^6.2.1",
"socket.io-client": "^4.4.1"
},
"scripts": {
"start-local": "webpack serve --config webpack.config.ts",

2
src/api-bodies/MockData.tsx
View File

@ -157,7 +157,7 @@ const meetings = [
];
const team = {
user: "0",
user: "",
manager: "1",
sameManager: ["2", "3", "4", "5", "6"],
directReports: [],

3
src/api-bodies/UserFull.tsx
View File

@ -3,7 +3,8 @@ import UserLite from "./UserLite";
interface UserFull {
userInfo: UserLite;
manager: UserLite;
directReports: UserLite[];
managerDirectReports: UserLite[];
userDirectReports: UserLite[];
}
export default UserFull;

4
src/api-bodies/UserStatus.tsx
View File

@ -1,7 +1,7 @@
interface UserStatus {
uuid: string;
userId: string;
inMeeting: boolean;
meetingID: string | null;
meetingId: string | null;
}
export default UserStatus;

4
src/components/contacts/contacts-components/Sidebar.tsx
View File

@ -27,13 +27,13 @@ const Sidebar: React.FC = () => {
const favorites = useAppSelector((state) =>
selectUsers(state, favoritesUuids)
);
let filteredFavorites = favorites.filter((favorite) =>
const filteredFavorites = favorites.filter((favorite) =>
favorite.name.toLowerCase().includes(inputText.toLowerCase())
);
const teamUuids = useAppSelector(selectTeam);
const team = useAppSelector((state) => selectUsers(state, teamUuids));
let filteredTeam = team.filter((member) =>
const filteredTeam = team.filter((member) =>
member.name.toLowerCase().includes(inputText.toLowerCase())
);

19
src/components/contacts/contacts-components/body-components/UpperBody.tsx
View File

@ -18,6 +18,7 @@ import {
} from "../../../../redux/slices/favoritesSlice";
import RemoveIcon from "@mui/icons-material/Remove";
import { MeetingStatus } from "../../../../utils";
import { selectMe } from "../../../../redux/slices/usersSlice";
interface Props {
contactInfo: UserLite;
@ -28,9 +29,10 @@ const UpperBody: React.FC<Props> = (props) => {
const userStatus: UserStatus = useAppSelector((state) =>
selectUserStatus(state, props.contactInfo.uuid)
);
const me = useAppSelector(selectMe);
const favoritesUuids = useAppSelector(selectFavorites);
const detailedMeeting = useAppSelector((state) =>
selectMeeting(state, userStatus.meetingID)
selectMeeting(state, userStatus.meetingId)
);
const meetingStatus: MeetingStatus =
userStatus && userStatus.inMeeting
@ -63,7 +65,11 @@ const UpperBody: React.FC<Props> = (props) => {
variant="outlined"
color="success"
startIcon={<AddIcon />}
onClick={() => dispatch(addFavorite(props.contactInfo.uuid))}
onClick={() =>
dispatch(
addFavorite({ userId: me, toBeAdded: props.contactInfo.uuid })
)
}
>
favorites
</Button>
@ -72,7 +78,14 @@ const UpperBody: React.FC<Props> = (props) => {
variant="outlined"
color="secondary"
startIcon={<RemoveIcon />}
onClick={() => dispatch(removeFavorite(props.contactInfo.uuid))}
onClick={() =>
dispatch(
removeFavorite({
userId: me,
toBeRemoved: props.contactInfo.uuid,
})
)
}
>
favorites
</Button>

1
src/components/home/CallFavouritesDialog.tsx
View File

@ -33,6 +33,7 @@ const CallFavouritesDialog: React.FC<Props> = ({
const handleClose = () => {
onClose(selectedValue);
};
console.log(users);
const [group, setGroup] = useState<string>("Favorites");
const [inputText, setInputText] = useState<string>("");

17
src/components/home/MeetingsPanel.tsx
View File

@ -8,7 +8,6 @@ import { formatTimeFromDate } from "../../utils";
import UserLite from "../../api-bodies/UserLite";
const MeetingsPanel: React.FC = () => {
const meetings = useAppSelector(selectMeetings);
const uuids: string[] = [];
meetings.forEach((meeting) => {
@ -41,7 +40,9 @@ const MeetingsPanel: React.FC = () => {
<Typography className="mylabel" sx={{ ml: 1 }}>Sunday, 03 Feb 2022</Typography>
</div> */}
<div className="row panel-label">
<Typography className="mylabel" sx={{ ml: 1 }}>Meetings in Progress</Typography>
<Typography className="mylabel" sx={{ ml: 1 }}>
Meetings in Progress
</Typography>
</div>
{meetings.map((meeting) => {
@ -56,7 +57,7 @@ const MeetingsPanel: React.FC = () => {
});
const startDate = new Date(meeting.start);
const startDatemil = startDate.getTime();
const endDatemil = startDatemil + meeting.duration*60000;
const endDatemil = startDatemil + meeting.duration * 60000;
const endDate = new Date(endDatemil);
const [currentDate, setCurrentDate] = useState<Date>(new Date());
useEffect(() => {
@ -69,8 +70,14 @@ const MeetingsPanel: React.FC = () => {
return (
<Meeting
meetingName={meeting.topic}
meetingTime={formatTimeFromDate(startDate) + " - " + formatTimeFromDate(endDate)}
meetingMembers={meetingMembers.map((userLite) => (" " + userLite.name + " ")).toString()}
meetingTime={
formatTimeFromDate(startDate) +
" - " +
formatTimeFromDate(endDate)
}
meetingMembers={meetingMembers
.map((userLite) => " " + userLite.name + " ")
.toString()}
/>
);
}

11
src/components/login/Login.tsx
View File

@ -12,7 +12,7 @@ import { store } from "../../redux/store";
import { fetchFavorites } from "../../redux/slices/favoritesSlice";
import { fetchMeetings } from "../../redux/slices/meetingsAndUserStatusSlice";
import { fetchUsers } from "../../redux/slices/usersSlice";
import axios from "../../api/axios"
import axios from "../../api/axios";
interface LocationState {
from: { pathname: string };
@ -52,15 +52,14 @@ const Login: React.FC = () => {
if (email === "" && password === "") {
setAuth["email"] = email;
setAuth["isLoggedIn"] = true;
navigate(from, { replace: true });
}
const response = await axios.post(
'/login',
"/login",
JSON.stringify({ email: email, password: password })
// { headers: { 'Content-Type': 'application/json' } }
)
);
// const response = { data: { userid: "123456" }}; // delete later
const logedInUserId = response?.data?.userId;
@ -72,13 +71,11 @@ const Login: React.FC = () => {
if (logedInUserId != undefined) {
setAuth["email"] = email;
setAuth["isLoggedIn"] = true;
setLogedInUser(logedInUserId);
navigate(from, { replace: true });
}
} catch (error) {
console.log(error);
}
setEmail(email);
setPassword("");

8
src/components/sidebar/SettingsButton.tsx
View File

@ -12,6 +12,7 @@ import {
import { open as openMeetingDetails } from "../../redux/slices/meetingDetailsOpenSlice";
import { selectMeeting } from "../../redux/slices/meetingsAndUserStatusSlice";
import { useNavigate } from "react-router-dom";
import { selectMe } from "../../redux/slices/usersSlice";
interface Props {
user: UserLite;
@ -21,9 +22,10 @@ interface Props {
const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
const navigate = useNavigate();
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
const me = useAppSelector(selectMe);
const favoritesUuids = useAppSelector(selectFavorites);
const meeting = useAppSelector((state) =>
selectMeeting(state, status.meetingID)
selectMeeting(state, status.meetingId)
);
const dispatch = useAppDispatch();
const open = Boolean(anchorEl);
@ -56,7 +58,7 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
<MenuItem
onClick={() => {
handleClose();
dispatch(removeFavorite(user.uuid));
dispatch(removeFavorite({ userId: me, toBeRemoved: user.uuid }));
}}
>
Remove from Favorites
@ -65,7 +67,7 @@ const SettingsButton: React.FC<Props> = ({ user, status }: Props) => {
<MenuItem
onClick={() => {
handleClose();
dispatch(addFavorite(user.uuid));
dispatch(addFavorite({ userId: me, toBeAdded: user.uuid }));
}}
>
Add to Favorites

44
src/redux/middleware/socketMiddleware.tsx Normal file
View File

@ -0,0 +1,44 @@
import { Middleware } from "redux";
import { io, Socket } from "socket.io-client";
import DetailedMeeting from "../../api-bodies/DetailedMeeting";
import { socketActions } from "../slices/meetingsAndUserStatusSlice";
const socketMiddleware: Middleware = (store) => {
let socket: Socket;
return (next) => (action) => {
const isConnectionEstablished =
socket && store.getState().meetingsAndUserStatuses.isConnected;
if (
socketActions.startConnecting.match(action) &&
!isConnectionEstablished
) {
console.log("startConnecting called");
socket = io("wss://uo5wdcbn6l.execute-api.us-west-2.amazonaws.com/Prod/");
socket.on("Connect", () => {
console.log("connected!!!");
store.dispatch(socketActions.connectionEstablished());
});
socket.on("MeetingCreated", (meeting: DetailedMeeting) => {
store.dispatch(socketActions.meetingCreated(meeting));
});
socket.on(
"UserStatusChange",
(statusChange: {
userId: string;
inMeeting: boolean;
meetingId: string;
}) => {
store.dispatch(socketActions.userStatusChanged(statusChange));
}
);
}
next(action);
};
};
export default socketMiddleware;

32
src/redux/slices/favoritesSlice.tsx
View File

@ -1,5 +1,6 @@
import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import { RootState } from "../store";
import axios from "../../api/axios";
import { favorites } from "../../api-bodies/MockData";
interface FavoritesState {
@ -32,24 +33,37 @@ export const favoritesSlice = createSlice({
export const fetchFavorites = createAsyncThunk(
"favorites/fetchFavorites",
async (uuid: string) => {
// const response = await client.post("/fakeApi/posts", initialPost);
// !!!
console.log(uuid);
if (uuid) {
const response = await axios.get(`/users/${uuid}/favourites`);
return response.data.userIds;
} else {
return favorites;
}
}
);
export const addFavorite = createAsyncThunk(
"favorites/addFavorite",
async (uuid: string) => {
// const response = await client.post("/fakeApi/posts", initialPost);
return uuid;
async (ids: { userId: string; toBeAdded: string }) => {
if (ids.userId) {
await axios.post(
`/users/${ids.userId}/favourites`,
JSON.stringify({ userId: ids.toBeAdded })
);
return ids.toBeAdded;
} else {
return ids.toBeAdded;
}
}
);
export const removeFavorite = createAsyncThunk(
"favorites/removeFavorite",
async (uuid: string) => {
// const response = await client.post("/fakeApi/posts", initialPost);
return uuid;
async (ids: { userId: string; toBeRemoved: string }) => {
if (ids.userId) {
await axios.delete(`/users/${ids.userId}/favourites/${ids.toBeRemoved}`);
return ids.toBeRemoved;
} else {
return ids.toBeRemoved;
}
}
);
export const selectFavorites = (state: RootState) => state.favorites.favorites;

57
src/redux/slices/meetingsAndUserStatusSlice.tsx
View File

@ -1,23 +1,42 @@
import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import DetailedMeeting from "../../api-bodies/DetailedMeeting";
import { RootState } from "../store";
import { meetings } from "../../api-bodies/MockData";
import UserStatus from "../../api-bodies/UserStatus";
import axios from "../../api/axios";
import { meetings } from "../../api-bodies/MockData";
interface MeetingsAndUserStatusState {
meetings: DetailedMeeting[];
userStatuses: Record<string, UserStatus>;
isConnecting: boolean;
isConnected: boolean;
}
const initialState: MeetingsAndUserStatusState = {
meetings: [],
userStatuses: {},
isConnecting: false,
isConnected: false,
};
export const meetingsAndUserStatusSlice = createSlice({
name: "meetingsAndUserStatus",
initialState,
reducers: {},
reducers: {
startConnecting: (state) => {
state.isConnecting = true;
},
connectionEstablished: (state) => {
state.isConnecting = true;
state.isConnected = true;
},
meetingCreated: (state, action) => {
state.meetings.push(action.payload.meeting);
},
userStatusChanged: (state, action) => {
state.userStatuses[action.payload.uuid] = action.payload;
},
},
extraReducers(builder) {
builder.addCase(fetchMeetings.fulfilled, (state, action) => {
state.meetings = action.payload.meetings;
@ -29,20 +48,35 @@ export const meetingsAndUserStatusSlice = createSlice({
export const fetchMeetings = createAsyncThunk(
"meetingsAndUserStatus/fetchMeetings",
async (uuid: string) => {
// const response = await client.post("/fakeApi/posts", initialPost);
// !!!
console.log(uuid);
if (uuid) {
const response = await axios.get(
`/users/${uuid}/meetings?start=1900-01-01&end=2100-01-01`
);
const meetings: DetailedMeeting[] = response.data.meetings;
const userStatuses: Record<string, UserStatus> = {};
meetings.forEach((meeting) => {
meeting.liveParticipantIds.forEach((uuid) => {
userStatuses[uuid] = {
uuid: uuid,
userId: uuid,
inMeeting: true,
meetingID: meeting.meetingId,
meetingId: meeting.meetingId,
};
});
});
return { userStatuses: userStatuses, meetings: meetings };
} else {
const userStatuses: Record<string, UserStatus> = {};
meetings.forEach((meeting) => {
meeting.liveParticipantIds.forEach((uuid) => {
userStatuses[uuid] = {
userId: uuid,
inMeeting: true,
meetingId: meeting.meetingId,
};
});
});
return { userStatuses: userStatuses, meetings: meetings };
}
}
);
@ -69,9 +103,9 @@ export const selectUserStatus = (
return userStatus;
} else {
return {
uuid: uuid,
userId: uuid,
inMeeting: false,
meetingID: null,
meetingId: null,
};
}
};
@ -86,12 +120,13 @@ export const selectUserStatuses = (
userStatuses.push(userStatus);
} else {
userStatuses.push({
uuid: uuid,
userId: uuid,
inMeeting: false,
meetingID: null,
meetingId: null,
});
}
});
return userStatuses;
};
export default meetingsAndUserStatusSlice.reducer;
export const socketActions = meetingsAndUserStatusSlice.actions;

42
src/redux/slices/usersSlice.tsx
View File

@ -1,7 +1,9 @@
import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import { RootState } from "../store";
import { userLites, team } from "../../api-bodies/MockData";
import UserLite from "../../api-bodies/UserLite";
import axios from "../../api/axios";
import UserFull from "../../api-bodies/UserFull";
import { userLites, team } from "../../api-bodies/MockData";
interface TeamState {
user: string;
@ -35,19 +37,45 @@ export const usersSlice = createSlice({
export const fetchUsers = createAsyncThunk(
"users/fetchUsers",
async (uuid: string) => {
if (uuid) {
const users: Record<string, UserLite> = {};
const team: TeamState = {
user: "",
manager: "",
sameManager: [],
directReports: [],
};
// fetch userfull
// fetch managerfull
// now you have yourself, co-workers, manager, and direct reports (your team basically!)
// call setTeam reducer in teamSlice
console.log(uuid);
const userResp = await axios.get(`/users/${uuid}`);
const user: UserFull = userResp.data.user;
users[user.userInfo.uuid] = user.userInfo;
users[user.manager.uuid] = user.manager;
team.user = user.userInfo.uuid;
team.manager = user.manager.uuid;
user.userDirectReports.forEach((userLite) => {
users[userLite.uuid] = userLite;
team.directReports.push(userLite.uuid);
});
user.managerDirectReports.forEach((userLite) => {
users[userLite.uuid] = userLite;
team.sameManager.push(userLite.uuid);
});
console.log(users);
return { users: users, team: team };
} else {
const users: Record<string, UserLite> = {};
userLites.forEach((userLite) => {
users[userLite.uuid] = userLite;
});
return { users: users, team: team };
}
}
);
export const selectMe = (state: RootState) => state.users.team.user;
export const selectUser = (
state: RootState,
uuid: string | undefined
@ -56,7 +84,9 @@ export const selectUser = (
};
export const selectUsers = (state: RootState, uuids: string[]): UserLite[] => {
const users: UserLite[] = [];
uuids.forEach((uuid) => users.push(state.users.users[uuid]));
uuids.forEach((uuid) => {
if (state.users.users[uuid]) users.push(state.users.users[uuid]);
});
return users;
};
export const selectTeam = (state: RootState) => {

4
src/redux/store.tsx
View File

@ -3,6 +3,7 @@ import meetingDetailsOpenReducer from "./slices/meetingDetailsOpenSlice";
import favoritesReducer from "./slices/favoritesSlice";
import meetingsAndUserStatusReducer from "./slices/meetingsAndUserStatusSlice";
import usersReducer from "./slices/usersSlice";
import socketMiddleware from "./middleware/socketMiddleware";
export const store = configureStore({
reducer: {
@ -11,6 +12,9 @@ export const store = configureStore({
meetingsAndUserStatuses: meetingsAndUserStatusReducer,
users: usersReducer,
},
middleware: (getDefaultMiddleware) => {
return getDefaultMiddleware().concat([socketMiddleware]);
},
});
export type RootState = ReturnType<typeof store.getState>;