Fakultas Ilmu Komputer UI

Commit 980c3fbe authored by WILLIAM GATES's avatar WILLIAM GATES
Browse files

Merge branch 'staging' into 'master'

Complete Admin Site

See merge request !78
parents dcf286a3 38240521
Pipeline #49835 passed with stages
in 13 minutes and 48 seconds
......@@ -41,6 +41,7 @@ staging:
script:
- npm install
- CI=false npm run build
- cp _redirects dist
- npm install netlify-cli -g --unsafe-perm
- netlify deploy --dir dist --prod
only:
......
......@@ -6,27 +6,47 @@
A local e-commerce application created for ease of buying and selling transactions.
## Table of Contents
- [Install](#install)
- [Running Development Mode](#running-development-mode)
- [References](#references)
## Install
The Admin Website's frontend uses Node.js and is developed using React. You need to install the required dependencies prior to building and contributing to the project.
- [Node.js](https://nodejs.org/en/download/releases/) and npm package manager
Verify that Node.js has been successfully installed. Make sure the interpreter can be invoked from the shell. For example:
```
npm --version
```
Now install the packages required for Node.js:
```
npm install
```
## Build
```
npm build
```
## Prepare environment
Create a .env file in the root folder. Inside the .env file, put
```
REACT_APP_BASE_URL= https://industripilar-staging.herokuapp.com
```
## Running Development Mode
To serve the frontend:
```
npm run start
```
......@@ -34,6 +54,6 @@ npm run start
You can see the app running by going to localhost:1234 via your favourite web browser.
## References
- https://docs.gitlab.com/ee/user/markdown.html#wiki---direct-page-link
- https://nodejs.org/en/download/package-manager/
......@@ -5327,6 +5327,11 @@
"integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==",
"dev": true
},
"downloadjs": {
"version": "1.4.7",
"resolved": "https://registry.npmjs.org/downloadjs/-/downloadjs-1.4.7.tgz",
"integrity": "sha1-9p+W+UDg0FU9rCkROYZaPNAQHjw="
},
"ecc-jsbn": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz",
......@@ -5913,9 +5918,9 @@
"dev": true
},
"eventemitter3": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.0.tgz",
"integrity": "sha512-qerSRB0p+UDEssxTtm6EDKcE7W4OaoisfIMl4CngyEhjpYglocpNg6UEqCvemdGhosAsg4sO2dXJOdyBifPGCg==",
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz",
"integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ==",
"dev": true
},
"events": {
......@@ -6884,9 +6889,9 @@
}
},
"http-proxy": {
"version": "1.18.0",
"resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.0.tgz",
"integrity": "sha512-84I2iJM/n1d4Hdgc6y2+qY5mDaz2PUVjlg9znE9byl+q0uC3DeByqBGReQu5tpLK0TAqTIXScRUV+dg7+bUPpQ==",
"version": "1.18.1",
"resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
"integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
"dev": true,
"requires": {
"eventemitter3": "^4.0.0",
......@@ -10911,9 +10916,9 @@
"dev": true
},
"moment": {
"version": "2.24.0",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.24.0.tgz",
"integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg=="
"version": "2.26.0",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.26.0.tgz",
"integrity": "sha512-oIixUO+OamkUkwjhAVE18rAMfRJNsNe/Stid/gwHSOfHrOtw9EhAY2AHvdKZ/k/MggcYELFCJz/Sn2pL8b8JMw=="
},
"moment-timezone": {
"version": "0.5.28",
......@@ -12716,9 +12721,9 @@
}
},
"react-hook-form": {
"version": "5.6.1",
"resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-5.6.1.tgz",
"integrity": "sha512-pqlAiWyZqngdEVUinxPSmhs9k2L/ETsTf8LU7wfwrE1bXJnslRsb4aKlYiL2z0bgGrCuksN8el5bxFbnR1/qEA=="
"version": "5.7.2",
"resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-5.7.2.tgz",
"integrity": "sha512-bJvY348vayIvEUmSK7Fvea/NgqbT2racA2IbnJz/aPlQ3GBtaTeDITH6rtCa6y++obZzG6E3Q8VuoXPir7QYUg=="
},
"react-is": {
"version": "16.13.1",
......
public/favicon.ico

3.08 KB | W: | H:

public/favicon.ico

1.12 KB | W: | H:

public/favicon.ico
public/favicon.ico
public/favicon.ico
public/favicon.ico
  • 2-up
  • Swipe
  • Onion skin
......@@ -19,7 +19,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
<title>Industri Pilar Admin</title>
</head>
<body style="background-color: #F5F8F9">
<noscript>You need to enable JavaScript to run this app.</noscript>
......
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../utils/contex";
import React from "react";
import Pengaturan from "../page/pengaturan/Pengaturan";
import { waitFor } from "@testing-library/dom";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Config update email", async () => {
fetch
.once(
JSON.stringify({
email: "pilar@gmail.com",
})
)
.once(
JSON.stringify({
hamlet: "016",
urban_village: "Penggilingan",
sub_district: "Cakung",
same_hamlet_costs: "6000.00",
same_urban_village_different_hamlet_costs: "12000.00",
same_sub_district_different_urban_village_costs: "15000.00",
})
)
.once(JSON.stringify({}), { statusCode: 200 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<Pengaturan />
</AuthContext.Provider>
);
const waitConfig = getByTestId("waiting-config");
expect(waitConfig.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("form-config"));
const email = getByTestId("email-admin");
expect(email.value).toEqual("pilar@gmail.com");
await act(async () => {
await fireEvent.input(email, { target: { value: "test@gmail.com" } });
await fireEvent.submit(getByTestId("submit-email"));
});
expect(fetch.mock.calls.length).toEqual(3);
});
test("Config update email empty", async () => {
fetch
.once(
JSON.stringify({
email: "pilar@gmail.com",
})
)
.once(
JSON.stringify({
hamlet: "016",
urban_village: "Penggilingan",
sub_district: "Cakung",
same_hamlet_costs: "6000.00",
same_urban_village_different_hamlet_costs: "12000.00",
same_sub_district_different_urban_village_costs: "15000.00",
})
)
.once(JSON.stringify({}), { statusCode: 200 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<Pengaturan />
</AuthContext.Provider>
);
const waitConfig = getByTestId("waiting-config");
expect(waitConfig.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("form-config"));
const email = getByTestId("email-admin");
expect(email.value).toEqual("pilar@gmail.com");
await act(async () => {
await fireEvent.input(email, { target: { value: "" } });
await fireEvent.submit(getByTestId("submit-email"));
});
expect(fetch.mock.calls.length).toEqual(2);
});
test("Config update shipping", async () => {
fetch
.once(
JSON.stringify({
email: "pilar@gmail.com",
})
)
.once(
JSON.stringify({
hamlet: "016",
urban_village: "Penggilingan",
sub_district: "Cakung",
same_hamlet_costs: "6000.00",
same_urban_village_different_hamlet_costs: "12000.00",
same_sub_district_different_urban_village_costs: "15000.00",
})
)
.once(JSON.stringify({}), { statusCode: 200 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<Pengaturan />
</AuthContext.Provider>
);
const waitConfig = getByTestId("waiting-config");
expect(waitConfig.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("form-config"));
const rw = getByTestId("rw");
expect(rw.value).toEqual("016");
const kelurahan = getByTestId("kelurahan");
expect(kelurahan.value).toEqual("Penggilingan");
const kecamatan = getByTestId("kecamatan");
expect(kecamatan.value).toEqual("Cakung");
const rwCost = getByTestId("rw-cost");
expect(rwCost.value).toEqual("6000.00");
const kelurahanCost = getByTestId("kelurahan-cost");
expect(kelurahanCost.value).toEqual("12000.00");
const kecamatanCost = getByTestId("kecamatan-cost");
expect(kecamatanCost.value).toEqual("15000.00");
expect(fetch.mock.calls.length).toEqual(2);
await act(async () => {
await fireEvent.input(rw, { target: { value: "001" } });
await fireEvent.input(kelurahan, { target: { value: "ada" } });
await fireEvent.input(kecamatan, { target: { value: "deh" } });
await fireEvent.input(rwCost, { target: { value: "5000" } });
await fireEvent.input(kelurahanCost, { target: { value: "10000" } });
await fireEvent.input(kecamatanCost, { target: { value: "12000" } });
await fireEvent.submit(getByTestId("submit-shipping"));
});
expect(fetch.mock.calls.length).toEqual(3);
});
test("Config update shipping empty", async () => {
fetch
.once(
JSON.stringify({
email: "pilar@gmail.com",
})
)
.once(
JSON.stringify({
hamlet: "016",
urban_village: "Penggilingan",
sub_district: "Cakung",
same_hamlet_costs: "6000.00",
same_urban_village_different_hamlet_costs: "12000.00",
same_sub_district_different_urban_village_costs: "15000.00",
})
)
.once(JSON.stringify({}), { statusCode: 200 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<Pengaturan />
</AuthContext.Provider>
);
const waitConfig = getByTestId("waiting-config");
expect(waitConfig.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("form-config"));
const rw = getByTestId("rw");
expect(rw.value).toEqual("016");
const kelurahan = getByTestId("kelurahan");
expect(kelurahan.value).toEqual("Penggilingan");
const kecamatan = getByTestId("kecamatan");
expect(kecamatan.value).toEqual("Cakung");
const rwCost = getByTestId("rw-cost");
expect(rwCost.value).toEqual("6000.00");
const kelurahanCost = getByTestId("kelurahan-cost");
expect(kelurahanCost.value).toEqual("12000.00");
const kecamatanCost = getByTestId("kecamatan-cost");
expect(kecamatanCost.value).toEqual("15000.00");
expect(fetch.mock.calls.length).toEqual(2);
await act(async () => {
await fireEvent.input(rw, { target: { value: "" } });
await fireEvent.input(kelurahan, { target: { value: "" } });
await fireEvent.input(kecamatan, { target: { value: "" } });
await fireEvent.input(rwCost, { target: { value: "" } });
await fireEvent.input(kelurahanCost, { target: { value: "" } });
await fireEvent.input(kecamatanCost, { target: { value: "" } });
await fireEvent.submit(getByTestId("submit-shipping"));
});
expect(fetch.mock.calls.length).toEqual(2);
});
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import { waitFor } from "@testing-library/dom";
import React from "react";
import EditBank from "../../page/bank/EditBank";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test edit bank renders", async () => {
fetch
.once(
JSON.stringify({
id: "e1827709-82a3-4a6f-b55c-bb1a229b7036",
bank_name: "bca",
bank_account_number: "1234456",
bank_account_name: "test bca",
})
)
.once(JSON.stringify({}));
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<EditBank />
</AuthContext.Provider>
);
const waitBank = getByTestId("waiting-edit-bank");
expect(waitBank.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-bank"));
const name_bank = getByTestId("name-bank-input");
expect(name_bank.value).toEqual("bca");
expect(fetch.mock.calls.length).toEqual(1);
await act(async () => {
await fireEvent.input(name_bank, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-bank"));
});
expect(fetch.mock.calls.length).toEqual(2);
});
test("Test edit bank error", async () => {
fetch
.once(
JSON.stringify({
id: "e1827709-82a3-4a6f-b55c-bb1a229b7036",
bank_name: "bca",
bank_account_number: "1234456",
bank_account_name: "test bca",
})
)
.once(JSON.stringify({}), { status: 400 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<EditBank />
</AuthContext.Provider>
);
const waitBank = getByTestId("waiting-edit-bank");
expect(waitBank.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-bank"));
const name_bank = getByTestId("name-bank-input");
expect(name_bank.value).toEqual("bca");
expect(fetch.mock.calls.length).toEqual(1);
await act(async () => {
await fireEvent.input(name_bank, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-bank"));
});
const bank = getByTestId("edit-bank");
expect(bank.textContent).toContain("Error !, Data tidak dapat disimpan");
expect(fetch.mock.calls.length).toEqual(2);
});
import { cleanup, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import React from "react";
import ListBank from "../../page/bank/ListBank";
import { waitFor } from "@testing-library/dom";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test List Bank", async () => {
fetch.mockResponseOnce(
JSON.stringify({
count: 11,
next:
"https://industripilar-staging.herokuapp.com/bank-account-transfer-destinations/?page=2",
previous: null,
results: [
{
id: "e1827709-82a3-4a6f-b55c-bb1a229b7036",
bank_name: "bca",
bank_account_number: "1234456",
bank_account_name: "test bca",
},
{
id: "3e7974da-47fb-47ed-a83c-525e237a8c41",
bank_name: "bca1",
bank_account_number: "1234456",
bank_account_name: "test bca",
},
],
})
);
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "tester" } }}>
<ListBank />
</AuthContext.Provider>
);
await waitFor(() => getByTestId("tableList"));
const data = getByTestId("tableList");
expect(data.textContent).toContain("bca");
expect(fetch.mock.calls.length).toEqual(1);
});
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import React from "react";
import TambahBank from "../../page/bank/TambahBank";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test tambah bank renders", async () => {
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<TambahBank />
</AuthContext.Provider>
);
const name_bank = getByTestId("name-bank-input");
await act(async () => {
await fireEvent.input(name_bank, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-bank"));
});
expect(fetch.mock.calls.length).toEqual(0);
});
......@@ -23,7 +23,6 @@ test("Test context state", async () => {
await act(async () => {
await navigate("/pengguna");
});
expect(getByTestId("page").textContent).toContain("Pengguna");
await act(async () => {
await fireEvent.click(getByTestId("logout"));
......
......@@ -94,7 +94,7 @@ test(" Test List transaksi filter", async () => {
});
await act(async () => {
await fireEvent.input(
getByLabelText("Status Donasi:", { target: { value: "001" } })
getByLabelText("Status Donasi", { target: { value: "001" } })
);
await fireEvent.click(getByTestId("submit-filter"));
});
......
import { act, cleanup, fireEvent, render } from "@testing-library/react";
import AuthContext from "../../utils/contex";
import { waitFor } from "@testing-library/dom";
import React from "react";
import EditProduk from "../../page/program/EditProgram";
beforeEach(() => {
fetch.resetMocks();
});
afterEach(cleanup);
test("Test edit program renders", async () => {
fetch.once(
JSON.stringify({
id: "6d7462da-6a85-4e2b-9930-69567090a5d5",
code: "3MXZ9T",
name: "dummy 2",
description: "yeyyy",
start_date_time: null,
end_date_time: null,
location: "Depok",
speaker: "Eddrick",
open_donation: true,
program_minutes: null,
poster_image:
"https://industripilar-api-staging.s3.amazonaws.com/media/uploads/programs/1_txtcYocQEGtOFN33ZCTDbw.png",
link: null,
total_donation_amount: "2263691.00",
})
);
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<EditProduk />
</AuthContext.Provider>
);
const waitProgram = getByTestId("waiting-edit-program");
expect(waitProgram.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-program"));
const name_program = getByTestId("name-program-input");
expect(name_program.value).toEqual("dummy 2");
await act(async () => {
await fireEvent.input(name_program, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-program"));
});
expect(fetch.mock.calls.length).toEqual(2);
});
test("Test edit program renders error", async () => {
fetch
.once(
JSON.stringify({
id: "6d7462da-6a85-4e2b-9930-69567090a5d5",
code: "3MXZ9T",
name: "dummy 2",
description: "yeyyy",
start_date_time: null,
end_date_time: null,
location: "Depok",
speaker: "Eddrick",
open_donation: true,
program_minutes: null,
poster_image:
"https://industripilar-api-staging.s3.amazonaws.com/media/uploads/programs/1_txtcYocQEGtOFN33ZCTDbw.png",
link: null,
total_donation_amount: "2263691.00",
})
)
.once(JSON.stringify({}), { status: 400 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<EditProduk />
</AuthContext.Provider>