Fakultas Ilmu Komputer UI

Commit 8c5ca875 authored by Jeffrey's avatar Jeffrey
Browse files

Merge branch 'Task-1-PBI-15-list_bank' into 'PBI-15-kelola_bank'

Task 1 pbi 15 list bank

See merge request !67
parents fa151e29 2e57728b
Pipeline #47766 passed with stages
in 7 minutes and 20 seconds
......@@ -9,113 +9,8 @@ beforeEach(() => {
});
afterEach(cleanup);
test("Config update bank-account", async () => {
fetch
.once(
JSON.stringify({
bank_name: "BNI",
account_number: "987654321",
account_owner: "Kak Mpit",
})
)
.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 bankName = getByTestId("bank-name");
expect(bankName.value).toEqual("BNI");
const accountName = getByTestId("account-name");
expect(accountName.value).toEqual("Kak Mpit");
const accountNumber = getByTestId("account-number");
expect(accountNumber.value).toEqual("987654321");
expect(fetch.mock.calls.length).toEqual(3);
await act(async () => {
await fireEvent.input(bankName, { target: { value: "test" } });
await fireEvent.input(accountName, { target: { value: "testAcount" } });
await fireEvent.input(accountNumber, { target: { value: "123" } });
await fireEvent.submit(getByTestId("submit-bank"));
});
expect(fetch.mock.calls.length).toEqual(4);
});
test("Config update bank-account empty", async () => {
fetch
.once(
JSON.stringify({
bank_name: "BNI",
account_number: "987654321",
account_owner: "Kak Mpit",
})
)
.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 bankName = getByTestId("bank-name");
expect(bankName.value).toEqual("BNI");
const accountName = getByTestId("account-name");
expect(accountName.value).toEqual("Kak Mpit");
const accountNumber = getByTestId("account-number");
expect(accountNumber.value).toEqual("987654321");
expect(fetch.mock.calls.length).toEqual(3);
await act(async () => {
await fireEvent.input(bankName, { target: { value: "" } });
await fireEvent.input(accountName, { target: { value: "" } });
await fireEvent.input(accountNumber, { target: { value: "" } });
await fireEvent.submit(getByTestId("submit-bank"));
});
expect(fetch.mock.calls.length).toEqual(3);
});
test("Config update email", async () => {
fetch
.once(
JSON.stringify({
bank_name: "BNI",
account_number: "987654321",
account_owner: "Kak Mpit",
})
)
.once(
JSON.stringify({
email: "pilar@gmail.com",
......@@ -146,18 +41,11 @@ test("Config update email", async () => {
await fireEvent.input(email, { target: { value: "test@gmail.com" } });
await fireEvent.submit(getByTestId("submit-email"));
});
expect(fetch.mock.calls.length).toEqual(4);
expect(fetch.mock.calls.length).toEqual(3);
});
test("Config update email empty", async () => {
fetch
.once(
JSON.stringify({
bank_name: "BNI",
account_number: "987654321",
account_owner: "Kak Mpit",
})
)
.once(
JSON.stringify({
email: "pilar@gmail.com",
......@@ -188,18 +76,11 @@ test("Config update email empty", async () => {
await fireEvent.input(email, { target: { value: "" } });
await fireEvent.submit(getByTestId("submit-email"));
});
expect(fetch.mock.calls.length).toEqual(3);
expect(fetch.mock.calls.length).toEqual(2);
});
test("Config update shipping", async () => {
fetch
.once(
JSON.stringify({
bank_name: "BNI",
account_number: "987654321",
account_owner: "Kak Mpit",
})
)
.once(
JSON.stringify({
email: "pilar@gmail.com",
......@@ -237,7 +118,7 @@ test("Config update shipping", async () => {
expect(kelurahanCost.value).toEqual("12000.00");
const kecamatanCost = getByTestId("kecamatan-cost");
expect(kecamatanCost.value).toEqual("15000.00");
expect(fetch.mock.calls.length).toEqual(3);
expect(fetch.mock.calls.length).toEqual(2);
await act(async () => {
await fireEvent.input(rw, { target: { value: "001" } });
await fireEvent.input(kelurahan, { target: { value: "ada" } });
......@@ -247,18 +128,11 @@ test("Config update shipping", async () => {
await fireEvent.input(kecamatanCost, { target: { value: "12000" } });
await fireEvent.submit(getByTestId("submit-shipping"));
});
expect(fetch.mock.calls.length).toEqual(4);
expect(fetch.mock.calls.length).toEqual(3);
});
test("Config update shipping empty", async () => {
fetch
.once(
JSON.stringify({
bank_name: "BNI",
account_number: "987654321",
account_owner: "Kak Mpit",
})
)
.once(
JSON.stringify({
email: "pilar@gmail.com",
......@@ -296,7 +170,7 @@ test("Config update shipping empty", async () => {
expect(kelurahanCost.value).toEqual("12000.00");
const kecamatanCost = getByTestId("kecamatan-cost");
expect(kecamatanCost.value).toEqual("15000.00");
expect(fetch.mock.calls.length).toEqual(3);
expect(fetch.mock.calls.length).toEqual(2);
await act(async () => {
await fireEvent.input(rw, { target: { value: "" } });
await fireEvent.input(kelurahan, { target: { value: "" } });
......@@ -306,5 +180,5 @@ test("Config update shipping empty", async () => {
await fireEvent.input(kecamatanCost, { target: { value: "" } });
await fireEvent.submit(getByTestId("submit-shipping"));
});
expect(fetch.mock.calls.length).toEqual(3);
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);
});
......@@ -54,6 +54,7 @@ const Sidebar = () => {
<LinkSidebar to="/program">PROGRAM</LinkSidebar>
<LinkSidebar to="/donasi">DONASI</LinkSidebar>
<LinkSidebar to="/pengguna">PENGGUNA</LinkSidebar>
<LinkSidebar to="/bank">BANK</LinkSidebar>
<LinkSidebar to="/pengaturan">PENGATURAN</LinkSidebar>
<Center
css={css`
......
import React from "react";
import TableComponent from "../../component/TableComponent";
import { css } from "@emotion/core";
const ListBank = () => {
const data = {
url: `${process.env.REACT_APP_BASE_URL}/bank-account-transfer-destinations/`,
pageDefault: 1,
title: "",
keyValuePairs: [
["id", "id"],
["bank_name", "Nama Bank"],
["bank_account_number", "Nomor Rekening"],
["bank_account_name", "Nama Pemilik Rekening"],
],
link: "/bank-account-transfer-destinations/",
};
return (
<div
css={css`
display: flex;
flex-direction: column;
margin: 2rem 3rem 3rem 3rem;
`}
>
<div
css={css`
font-size: 35px;
`}
>
KELOLA BANK
</div>
<TableComponent {...data} />
</div>
);
};
export default ListBank;
......@@ -99,7 +99,7 @@ const DetailDonasi = ({ idDonasi }) => {
margin-right: 1rem;
`}
>
Donation code:
Kode Donasi:
</div>
<div>{donation.donation_number}</div>
</div>
......@@ -142,7 +142,7 @@ const DetailDonasi = ({ idDonasi }) => {
margin-right: 0.5rem;
`}
>
Date created:{" "}
Tanggal dibuat:{" "}
</div>
<div>{stringToDate(donation.created_at)}</div>
</div>
......@@ -157,7 +157,7 @@ const DetailDonasi = ({ idDonasi }) => {
margin-right: 0.5rem;
`}
>
Date updated:{" "}
Tanggal diperbarui:{" "}
</div>
<div>{stringToDate(donation.updated_at)}</div>
</div>
......@@ -217,7 +217,7 @@ const DetailDonasi = ({ idDonasi }) => {
margin-right: 1rem;
`}
>
Sender name:{" "}
Nama Pengirim:
</div>
<div>{donation.user_bank_account_name}</div>
</div>
......@@ -233,10 +233,52 @@ const DetailDonasi = ({ idDonasi }) => {
margin-right: 1rem;
`}
>
Sender account number:{" "}
Nomor Rekening Pengirim:
</div>
<div>{donation.user_bank_account_number}</div>
</div>
<div
css={css`
display: flex;
font-size: 1.2rem;
align-items: baseline;
`}
>
<div
css={css`
margin-right: 1rem;
`}
>
Nama Bank dan Pemilik Rekening Tujuan:
</div>
<div>
{donation.transfer_destination_bank_name} -{" "}
{donation.transfer_destination_bank_account_name}
</div>
</div>
<div
css={css`
display: flex;
font-size: 1.2rem;
align-items: baseline;
`}
>
<div
css={css`
margin-right: 1rem;
`}
>
Nomor Rekening Tujuan:
</div>
<div>{donation.transfer_destination_bank_account_number}</div>
</div>
<div
css={css`
margin-top: 1rem;
`}
>
{" "}
</div>
<Button
onClick={handleClickOpen}
variant="contained"
......
......@@ -4,7 +4,6 @@ import PengaturanForm from "./PengaturanForm";
import { css } from "@emotion/core";
const Pengaturan = () => {
const url = `${process.env.REACT_APP_BASE_URL}`;
const [bank, errorBank] = useFetchSingleData(`${url}/configs/bank-account/`);
const [email, errorContact] = useFetchSingleData(
`${url}/configs/help-contact/`
);
......@@ -12,10 +11,8 @@ const Pengaturan = () => {
`${url}/configs/shipment/`
);
if (
Object.keys(bank).length === 0 ||
Object.keys(email).length === 0 ||
Object.keys(shipping).length === 0 ||
errorBank ||
errorContact ||
errorShipping
)
......@@ -32,7 +29,7 @@ const Pengaturan = () => {
Fetching data..
</div>
);
return <PengaturanForm {...{ bank, email, shipping }} />;
return <PengaturanForm {...{ email, shipping }} />;
};
export default Pengaturan;
......@@ -11,14 +11,7 @@ import Button from "@material-ui/core/Button";
import SaveIcon from "@material-ui/icons/Save";
import useSendData from "../../utils/useSendData";
const PengaturanForm = ({ bank, email, shipping }) => {
const {
register: registerBank,
errors: errorFormBank,
handleSubmit: handleBank,
} = useForm({
defaultValues: { ...bank },
});
const PengaturanForm = ({ email, shipping }) => {
const {
register: registerEmail,
errors: errorFormEmail,
......@@ -41,10 +34,6 @@ const PengaturanForm = ({ bank, email, shipping }) => {
"Content-Type": "application/json",
},
};
const [sendBank, errorBank] = useSendData({
url: `${url}/configs/bank-account/`,
...conf,
});
const [sendEmail, errorEmail] = useSendData({
url: `${url}/configs/help-contact/`,
...conf,
......@@ -57,10 +46,6 @@ const PengaturanForm = ({ bank, email, shipping }) => {
const submitShipping = (data) => {
sendShipping(JSON.stringify(data));
};
const submitBank = (data) => {
sendBank(JSON.stringify({ ...data }));
};
const submitEmail = (data) => {
sendEmail(JSON.stringify({ ...data }));
};
......@@ -73,69 +58,6 @@ const PengaturanForm = ({ bank, email, shipping }) => {
margin: 2rem 3rem 3rem 3rem;
`}
>
<form
css={css`
display: flex;
flex-direction: column;
`}
onSubmit={handleBank(submitBank)}
>
<h4>Akun bank</h4>
{errorBank && <ErrorDiv>Error simpan konfigurasi bank</ErrorDiv>}
<RowInput>
<LabelInput htmlFor="name">Nama bank: </LabelInput>
<InputForm
data-testid="bank-name"
name="bank_name"
ref={registerBank({ required: true })}
/>
{errorFormBank.bank_name && (
<ErrorDiv>Nama bank tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="name">Nama pemilik rekening: </LabelInput>
<InputForm
data-testid="account-name"
name="account_owner"
ref={registerBank({ required: true })}
/>
{errorFormBank.account_owner && (
<ErrorDiv>Nama pemilik rekening tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="name">Nomor rekening: </LabelInput>
<InputForm
data-testid="account-number"
name="account_number"
type="number"
ref={registerBank({ required: true })}
/>
{errorFormBank.account_number && (
<ErrorDiv>Nomor rekening tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<div
css={css`
align-self: flex-end;
display: flex;
`}
>
<Button
data-testid="submit-bank"
variant="contained"
color="primary"
size="large"
startIcon={<SaveIcon />}
type="submit"
>
Save
</Button>
</div>
</form>
<form
css={css`
display: flex;
......
......@@ -107,7 +107,7 @@ const DetailTransaksi = ({ idTransaksi }) => {
margin-right: 1rem;
`}
>
Transaction code:
Kode Transaksi:
</div>
<div>{transaction.transaction_number}</div>
</div>
......@@ -152,7 +152,7 @@ const DetailTransaksi = ({ idTransaksi }) => {
margin-right: 0.5rem;
`}
>
Date created:{" "}
Tanggal dibuat:{" "}
</div>
<div>{stringToDate(transaction.created_at)}</div>
</div>
......@@ -167,7 +167,7 @@ const DetailTransaksi = ({ idTransaksi }) => {
margin-right: 0.5rem;
`}
>
Date updated:{" "}
Tanggal diperbarui:{" "}
</div>
<div>{stringToDate(transaction.updated_at)}</div>
</div>
......@@ -217,10 +217,10 @@ const DetailTransaksi = ({ idTransaksi }) => {
<Table aria-label="simple table">
<TableHead>
<TableRow>
<TableCell>Product Code</TableCell>
<TableCell>Product Name</TableCell>
<TableCell>Quantity</TableCell>
<TableCell>Product Price</TableCell>
<TableCell>Kode Produk</TableCell>
<TableCell>Nama Produk</TableCell>
<TableCell>Kuantitas</TableCell>
<TableCell>Harga Produk</TableCell>
<TableCell>Subtotal</TableCell>
</TableRow>
</TableHead>
......@@ -320,7 +320,7 @@ const DetailTransaksi = ({ idTransaksi }) => {
margin-right: 1rem;
`}
>
Sender name:{" "}
Nama Pengirim:{" "}
</div>
<div>{transaction.user_bank_account_name}</div>
</div>
......@@ -336,10 +336,47 @@ const DetailTransaksi = ({ idTransaksi }) => {
margin-right: 1rem;
`}
>
Sender account number:{" "}
Nomor Rekening Pengirim:{" "}
</div>
<div>{transaction.user_bank_account_number}</div>
</div>
<div
css={css`
display: flex;
font-size: 1.2rem;
align-items: baseline;
`}
>
<div
css={css`
margin-right: 1rem;
`}
>
Nama Bank dan Pemilik Rekening Tujuan:{" "}
</div>
<div>
{transaction.transfer_destination_bank_name} -{" "}
{transaction.transfer_destination_bank_account_name}
</div>
</div>
<div
css={css`
display: flex;
font-size: 1.2rem;
align-items: baseline;
`}
>