Skip to content

Commit d99c8e3

Browse files
kaushik327kaushik327
authored
Merge pull request #7 from acm-uiuc/el-jl/connect-backend
Connect backend and frontend
2 parents 6636f93 + cf91b57 commit d99c8e3

File tree

17 files changed

+264
-96
lines changed

17 files changed

+264
-96
lines changed

‎.DS_Store

-10 KB
Binary file not shown.

‎.github/.DS_Store

-6 KB
Binary file not shown.

‎.github/workflows/.DS_Store

-6 KB
Binary file not shown.

‎.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules/
2+
3+
.DS_Store

‎admin-api-frontend/.gitignore

+4
Original file line numberDiff line numberDiff line change
@@ -21,3 +21,7 @@
2121
npm-debug.log*
2222
yarn-debug.log*
2323
yarn-error.log*
24+
25+
*.env
26+
27+
node_modules/

‎admin-api-frontend/package-lock.json

+26-14
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎admin-api-frontend/package.json

+2
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@
1313
"@typescript-eslint/parser": "^7.4.0",
1414
"bootstrap": "^5.3.3",
1515
"framer-motion": "^11.0.5",
16+
"os-browserify": "^0.3.0",
17+
"path-browserify": "^1.0.1",
1618
"react": "^18.2.0",
1719
"react-bootstrap": "^2.10.2",
1820
"react-dom": "^18.2.0",

‎admin-api-frontend/src/api.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import axios from "axios";
2+
// import { useState } from "react";
3+
4+
export default axios.create({
5+
baseURL: `${BASE_URL}/api/v1/`,
6+
});

‎admin-api-frontend/src/components/AddRolesForm/index.tsx

+23-19
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,33 @@
11
import React, { useState } from "react";
22
import { Input, Button } from "@nextui-org/react";
3+
import useFetchWithMsal from "../../hooks/useFetchWithMsal.jsx";
4+
import { loginRequest } from "../../authConfig.js";
35

46
const AddRolesForm = () => {
7+
const BASE_URL = process.env.REACT_APP_BASE_URL;
8+
59
const [netID, setNetID] = useState<string>("");
610
const [roles, setRoles] = useState<string>("");
7-
const [rolesSplit, setRolesSplit] = useState<string[]>([]);
8-
9-
const handleNetIDChange = (event) => {
10-
setNetID(event.target.value);
11-
};
1211

13-
const handleRolesChange = (event) => {
14-
setRoles(event.target.value);
15-
setRolesSplit(event.target.value.split(","));
12+
const { execute } = useFetchWithMsal(loginRequest);
13+
const handleAddRolesThroughUpdate = async () => {
14+
try {
15+
execute(
16+
"PUT",
17+
`${BASE_URL}/default/api/v1/update_user?netid=${netID}&newRoles=${roles}&newPerms=`,
18+
null
19+
).then((response) => {
20+
console.log(response);
21+
});
22+
} catch (error) {
23+
console.log(error);
24+
}
1625
};
1726

1827
const handleSubmit = (event) => {
1928
if (netID !== "" && roles !== "") {
20-
console.log(netID);
21-
console.log(rolesSplit);
22-
console.log(permissionsSplit);
23-
// Do something with the netID, roles and permissions
24-
2529
event.preventDefault();
26-
setRolesSplit([]);
30+
handleAddRolesThroughUpdate();
2731
setNetID("");
2832
setRoles("");
2933
}
@@ -33,19 +37,19 @@ const AddRolesForm = () => {
3337
<div>
3438
<p>Add Roles</p>
3539
<form onSubmit={handleSubmit}>
36-
<div class="flex flex-col m-2">
37-
<div class="mb-2">
40+
<div className="flex flex-col m-2">
41+
<div className="mb-2">
3842
<Input
3943
placeholder="NetID"
4044
value={netID}
41-
onChange={handleNetIDChange}
45+
onChange={(event) => setNetID(event.target.value)}
4246
/>
4347
</div>
44-
<div class="mb-2">
48+
<div className="mb-2">
4549
<Input
4650
placeholder="Roles"
4751
value={roles}
48-
onChange={handleRolesChange}
52+
onChange={(event) => setRoles(event.target.value)}
4953
/>
5054
</div>
5155
<Button type="submit">Submit</Button>

‎admin-api-frontend/src/components/CreateUserForm/index.tsx

+25-29
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,34 @@
11
import React, { useState } from "react";
22
import { Input, Button } from "@nextui-org/react";
3+
import useFetchWithMsal from "../../hooks/useFetchWithMsal.jsx";
4+
import { loginRequest } from "../../authConfig.js";
35

46
const CreateUserForm = () => {
7+
const BASE_URL = process.env.REACT_APP_BASE_URL;
8+
59
const [netID, setNetID] = useState<string>("");
610
const [roles, setRoles] = useState<string>("");
7-
const [rolesSplit, setRolesSplit] = useState<string[]>([]);
8-
911
const [permissions, setPermissions] = useState<string>("");
10-
const [permissionsSplit, setPermissionsSplit] = useState<string[]>([]);
11-
12-
const handleNetIDChange = (event) => {
13-
setNetID(event.target.value);
14-
};
1512

16-
const handleRolesChange = (event) => {
17-
setRoles(event.target.value);
18-
setRolesSplit(event.target.value.split(","));
19-
};
20-
21-
const handlePermissionsChange = (event) => {
22-
setPermissions(event.target.value);
23-
setPermissionsSplit(event.target.value.split(","));
13+
const { execute } = useFetchWithMsal(loginRequest);
14+
const handleCreateUser = async () => {
15+
try {
16+
execute(
17+
"PUT",
18+
`${BASE_URL}/default/api/v1/create_user?netid=${netID}&permStr=${permissions}&roleStr=${roles}`,
19+
null
20+
).then((response) => {
21+
console.log(response);
22+
});
23+
} catch (error) {
24+
console.log(error);
25+
}
2426
};
2527

2628
const handleSubmit = (event) => {
2729
if (netID !== "" && roles !== "") {
28-
console.log(netID);
29-
console.log(rolesSplit);
30-
console.log(permissionsSplit);
31-
// Do something with the netID, roles and permissions
32-
30+
handleCreateUser();
3331
event.preventDefault();
34-
setRolesSplit([]);
35-
setPermissionsSplit([]);
3632
setNetID("");
3733
setRoles("");
3834
setPermissions("");
@@ -43,26 +39,26 @@ const CreateUserForm = () => {
4339
<div>
4440
<p>Create User</p>
4541
<form onSubmit={handleSubmit}>
46-
<div class="flex flex-col m-2">
47-
<div class="mb-2">
42+
<div className="flex flex-col m-2">
43+
<div className="mb-2">
4844
<Input
4945
placeholder="NetID"
5046
value={netID}
51-
onChange={handleNetIDChange}
47+
onChange={(event) => setNetID(event.target.value)}
5248
/>
5349
</div>
54-
<div class="mb-2">
50+
<div className="mb-2">
5551
<Input
5652
placeholder="Roles"
5753
value={roles}
58-
onChange={handleRolesChange}
54+
onChange={(event) => setRoles(event.target.value)}
5955
/>
6056
</div>
61-
<div class="mb-2">
57+
<div className="mb-2">
6258
<Input
6359
placeholder="Permissions"
6460
value={permissions}
65-
onChange={handlePermissionsChange}
61+
onChange={(event) => setPermissions(event.target.value)}
6662
/>
6763
</div>
6864
<Button type="submit">Submit</Button>

‎admin-api-frontend/src/components/DeleteUserForm/index.tsx

+21-8
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,31 @@
11
import React, { useState } from "react";
22
import { Input, Button } from "@nextui-org/react";
3+
import useFetchWithMsal from "../../hooks/useFetchWithMsal.jsx";
4+
import { loginRequest } from "../../authConfig.js";
35

46
const DeleteUserForm = () => {
7+
const BASE_URL = process.env.REACT_APP_BASE_URL;
8+
59
const [netID, setNetID] = useState<string>("");
610

7-
const handleNetIDChange = (event) => {
8-
setNetID(event.target.value);
11+
const { execute } = useFetchWithMsal(loginRequest);
12+
const handleDeleteUser = async () => {
13+
try {
14+
execute(
15+
"DELETE",
16+
`${BASE_URL}/default/api/v1/delete_user?netid=${netID}`,
17+
null
18+
).then((response) => {
19+
console.log(response);
20+
});
21+
} catch (error) {
22+
console.log(error);
23+
}
924
};
1025

1126
const handleSubmit = (event) => {
1227
if (netID !== "") {
13-
console.log(netID);
14-
// Do something with the netID
15-
28+
handleDeleteUser();
1629
event.preventDefault();
1730
setNetID("");
1831
}
@@ -22,12 +35,12 @@ const DeleteUserForm = () => {
2235
<div>
2336
<p>Delete User</p>
2437
<form onSubmit={handleSubmit}>
25-
<div class="flex flex-col m-2">
26-
<div class="mb-2">
38+
<div className="flex flex-col m-2">
39+
<div className="mb-2">
2740
<Input
2841
placeholder="NetID"
2942
value={netID}
30-
onChange={handleNetIDChange}
43+
onChange={(event) => setNetID(event.target.value)}
3144
/>
3245
</div>
3346
<Button type="submit">Submit</Button>

‎admin-api-frontend/src/components/GetUserInfoForm/index.tsx

+22-8
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,33 @@
11
import React, { useState } from "react";
22
import { Input, Button } from "@nextui-org/react";
3+
import useFetchWithMsal from "../../hooks/useFetchWithMsal.jsx";
4+
import { loginRequest } from "../../authConfig.js";
35

46
const GetUserInfoForm = () => {
7+
const BASE_URL = process.env.REACT_APP_BASE_URL;
8+
59
const [netID, setNetID] = useState<string>("");
610

7-
const handleNetIDChange = (event) => {
8-
setNetID(event.target.value);
11+
const { execute } = useFetchWithMsal(loginRequest);
12+
13+
const handleGetUser = async () => {
14+
try {
15+
execute(
16+
"GET",
17+
`${BASE_URL}/default/api/v1/get_user?netid=${netID}`,
18+
null
19+
).then((response) => {
20+
console.log(response);
21+
});
22+
} catch (error) {
23+
console.log(error);
24+
}
925
};
1026

1127
const handleSubmit = (event) => {
1228
if (netID !== "") {
13-
console.log(netID);
14-
// Do something with the netID
15-
1629
event.preventDefault();
30+
handleGetUser();
1731
setNetID("");
1832
}
1933
};
@@ -22,12 +36,12 @@ const GetUserInfoForm = () => {
2236
<div>
2337
<p>Get User</p>
2438
<form onSubmit={handleSubmit}>
25-
<div class="flex flex-col m-2">
26-
<div class="mb-2">
39+
<div className="flex flex-col m-2">
40+
<div className="mb-2">
2741
<Input
2842
placeholder="NetID"
2943
value={netID}
30-
onChange={handleNetIDChange}
44+
onChange={(event) => setNetID(event.target.value)}
3145
/>
3246
</div>
3347
<Button type="submit">Submit</Button>

0 commit comments

Comments
 (0)