Fakultas Ilmu Komputer UI

Commit ad2c38e8 authored by Michael Wiryadinata Halim's avatar Michael Wiryadinata Halim
Browse files

Merge branch 'Revisit-Kelola-Data-Produk' into 'staging'

Resolve "Revisit Kelola Data Produk"

See merge request !46
parents caad2f6c 0aee3261
Pipeline #43867 passed with stages
in 20 minutes and 53 seconds
......@@ -19,6 +19,7 @@ test("Test detail produk renders", async () => {
price: 70000,
stock: 5,
image: null,
pre_order: false,
})
);
......@@ -30,6 +31,33 @@ test("Test detail produk renders", async () => {
await waitFor(() => getByTestId("produk-detail"));
const produk = getByTestId("produk-detail");
expect(produk.textContent).toContain("Kue Nastar");
expect(produk.textContent).toContain("5");
expect(fetch.mock.calls.length).toEqual(1);
});
test("Test detail produk renders preorder", async () => {
fetch.mockResponseOnce(
JSON.stringify({
id: "ff0473d9-be63-497e-afc9-8610f57423d8",
name: "Kue Nastar",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
description: "Kue Nastar enak maknyuss",
price: 70000,
stock: null,
image: null,
pre_order: true,
})
);
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<DetailProduk />
</AuthContext.Provider>
);
await waitFor(() => getByTestId("produk-detail"));
const produk = getByTestId("produk-detail");
expect(produk.textContent).toContain("Kue Nastar");
expect(produk.textContent).toContain("Preorder");
expect(fetch.mock.calls.length).toEqual(1);
});
......
......@@ -9,20 +9,76 @@ beforeEach(() => {
});
afterEach(cleanup);
test("Test edit produk renders", async () => {
fetch.mockResponseOnce(
JSON.stringify({
id: "ff0473d9-be63-497e-afc9-8610f57423d8",
name: "Jas",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "1fac049f-592c-4c15-afe6-9e05a2ce1540",
subcategory_name: "Baju Pergi",
description: "Jas hitam",
price: "800000.00",
stock: 5,
image: null,
})
);
fetch
.once(
JSON.stringify({
id: "3d403cd3-e356-4c15-9a86-8843333e2778",
code: "5VK6TY",
name: "a",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
subcategory: "626aa022-50a7-4d3a-b658-79cb0f059b03",
subcategory_name: "Baju Tidur hehe",
description: "celana",
price: "50000.00",
stock: 17,
image: null,
pre_order: false,
})
)
.once(
JSON.stringify({
count: 4,
next: null,
previous: null,
results: [
{
id: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
name: "Baju",
image: null,
},
{
id: "0664247c-d9ea-4e56-bb02-4b8463f9e14c",
name: "Mainan",
image: null,
},
{
id: "8c2c06e6-0ead-4b9a-8de1-37237fc6bdc9",
name: "Makanan",
image: null,
},
{
id: "b8a9909b-9131-4c2b-bcc5-6bceb18f702c",
name: "Minuman",
image: null,
},
],
})
)
.once(
JSON.stringify({
count: 7,
next: null,
previous: null,
results: [
{
id: "626aa022-50a7-4d3a-b658-79cb0f059b03",
name: "Baju Tidur hehe",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
image: null,
},
{
id: "ab222bb8-46e4-40bb-bd47-7f546d356de1",
name: "joker baru",
category: "f0c08b4f-7421-4298-89e4-3d4a40ef15b4",
category_name: "Baju",
image: null,
},
],
})
)
.once(JSON.stringify({}), { statusCode: 200 });
const { getByTestId } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
......@@ -33,7 +89,7 @@ test("Test edit produk renders", async () => {
expect(waitProduk.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-produk"));
const name_produk = getByTestId("name-produk-input");
expect(name_produk.value).toEqual("Jas");
expect(name_produk.value).toEqual("a");
await act(async () => {
await fireEvent.input(name_produk, { target: { value: "test" } });
});
......@@ -41,7 +97,7 @@ test("Test edit produk renders", async () => {
await fireEvent.submit(getByTestId("submit-produk"));
});
expect(fetch.mock.calls.length).toEqual(4);
expect(fetch.mock.calls.length).toEqual(5);
});
test("Test edit produk renders error", async () => {
......@@ -59,6 +115,7 @@ test("Test edit produk renders error", async () => {
price: "50000.00",
stock: 17,
image: null,
pre_order: false,
})
)
.once(
......
......@@ -60,9 +60,10 @@ test("Test tambah produk renders", async () => {
},
],
})
);
)
.once(JSON.stringify({}), { statusCode: 200 });
const { getByTestId } = render(
const { getByTestId, getByLabelText } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<TambahProduk />
</AuthContext.Provider>
......@@ -83,10 +84,14 @@ test("Test tambah produk renders", async () => {
await act(async () => {
await fireEvent.input(stock_produk, { target: { value: "1" } });
});
await act(async () => {
await fireEvent.click(getByLabelText("Biasa"), {
target: { value: "false" },
});
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-produk"));
});
expect(fetch.mock.calls.length).toEqual(4);
});
......@@ -215,7 +220,7 @@ test("Test tambah produk error", async () => {
)
.once(JSON.stringify({}), { status: 400 });
const { getByTestId } = render(
const { getByTestId, getByLabelText } = render(
<AuthContext.Provider value={{ profile: { token: "BEBAS" } }}>
<TambahProduk />
</AuthContext.Provider>
......@@ -236,6 +241,11 @@ test("Test tambah produk error", async () => {
await act(async () => {
await fireEvent.input(stock_produk, { target: { value: "1" } });
});
await act(async () => {
await fireEvent.click(getByLabelText("Biasa"), {
target: { value: "false" },
});
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-produk"));
});
......
......@@ -10,7 +10,7 @@ import useSendData from "../../utils/useSendData";
const EditKategori = ({ idKategori }) => {
const url = `${process.env.REACT_APP_BASE_URL}/categories/${idKategori}/`;
const [initialData, errorState] = useFetchSingleData(url);
const [send, error] = useSendData({ url, method: "PATCH" });
const [send, error] = useSendData({ url, method: "PATCH", redirect: -1 });
const onSubmit = (data) => {
const formData = new FormData();
formData.append("name", data["name"]);
......
......@@ -251,7 +251,7 @@ const DetailProduk = ({ productId }) => {
margin-left: 1%;
`}
>
{product.stock}
{product.pre_order ? "Preorder" : product.stock}
</span>
</span>
</p>
......
......@@ -10,17 +10,9 @@ import useSendData from "../../utils/useSendData";
const EditProduk = ({ productId }) => {
const url = `${process.env.REACT_APP_BASE_URL}/products/${productId}/`;
const [initialData, errorState] = useFetchSingleData(url);
const [send, error] = useSendData({ url, method: "PATCH" });
const [send, error] = useSendData({ url, method: "PATCH", redirect: -1 });
const onSubmit = (data) => {
const formData = new FormData();
formData.append("name", data["name"]);
formData.append("category", data["category"]);
formData.append("subcategory", data["subcategory"]);
formData.append("description", data["description"]);
formData.append("price", data["price"]);
formData.append("stock", data["stock"]);
if (data["image"].length !== 0) formData.append("image", data["image"][0]);
send(formData);
send(data);
};
if (errorState || Object.keys(initialData).length === 0)
return (
......
......@@ -23,6 +23,7 @@ const FormProduk = ({ onSubmit, initialData = null }) => {
description: initialData["description"],
price: initialData["price"],
stock: initialData["stock"],
pre_order: initialData["pre_order"].toString(),
}
: {},
});
......@@ -36,17 +37,35 @@ const FormProduk = ({ onSubmit, initialData = null }) => {
null,
]);
const watchCategory = watch("category", "");
const watchPreorder = watch("pre_order");
const [resultsSubcategory, errorStateSubcategory, , , , , ,] = useFetchList([
urlSubcategory,
null,
null,
null,
`category=${watchCategory}`,
null,
]);
const filterSubmit = (data) => {
const formData = new FormData();
if (watchPreorder === "false") {
data.pre_order = false;
formData.append("stock", data["stock"]);
} else {
data.pre_order = true;
}
formData.append("name", data["name"]);
formData.append("subcategory", data["subcategory"]);
formData.append("description", data["description"]);
formData.append("price", data["price"]);
formData.append("pre_order", data["pre_order"]);
if (data["image"].length !== 0) formData.append("image", data["image"][0]);
onSubmit(formData);
};
return (
<form
data-testid="form-produk"
onSubmit={handleSubmit(onSubmit)}
onSubmit={handleSubmit(filterSubmit)}
css={css`
display: flex;
flex-direction: column;
......@@ -109,10 +128,52 @@ const FormProduk = ({ onSubmit, initialData = null }) => {
name="description"
ref={register({ required: true })}
/>
{errors.name && (
{errors.description && (
<ErrorDiv>Deskripsi Produk tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="is-preorder">Tipe Barang:</LabelInput>
<div
css={css`
display: flex;
flex-grow: 4;
align-items: baseline;
align-content: flex-start;
`}
>
<input
data-testid="is-preorder-produk-input"
type="radio"
name="pre_order"
value="false"
id="no-preorder"
ref={register({ required: true })}
/>
<label htmlFor="no-preorder">Biasa</label>
</div>
<div
css={css`
display: flex;
flex-grow: 4;
align-items: baseline;
align-content: flex-start;
`}
>
<input
data-testid="is-preorder-produk-input-2"
type="radio"
name="pre_order"
value="true"
id="preorder"
ref={register({ required: true })}
/>
<label htmlFor="preorder">Preorder</label>
</div>
{errors.pre_order && (
<ErrorDiv>Tipe Produk tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="harga">Harga/kuantitas </LabelInput>
<InputForm
......@@ -121,7 +182,7 @@ const FormProduk = ({ onSubmit, initialData = null }) => {
name="price"
ref={register({ required: true })}
/>
{errors.name && <ErrorDiv>Harga Produk tidak boleh kosong</ErrorDiv>}
{errors.price && <ErrorDiv>Harga Produk tidak boleh kosong</ErrorDiv>}
</RowInput>
<RowInput>
<LabelInput htmlFor="stock">Stok</LabelInput>
......@@ -129,9 +190,10 @@ const FormProduk = ({ onSubmit, initialData = null }) => {
data-testid="stock-produk-input"
type="number"
name="stock"
ref={register({ required: true })}
disabled={watchPreorder === "true"}
ref={register({ required: watchPreorder === "false" })}
/>
{errors.name && <ErrorDiv>Stok Produk tidak boleh kosong</ErrorDiv>}
{errors.stock && <ErrorDiv>Stok Produk tidak boleh kosong</ErrorDiv>}
</RowInput>
<RowInput>
......
......@@ -13,15 +13,7 @@ const TambahProduk = () => {
redirect: "/produk",
});
const onSubmit = (data) => {
const formData = new FormData();
formData.append("name", data["name"]);
formData.append("category", data["category"]);
formData.append("subcategory", data["subcategory"]);
formData.append("description", data["description"]);
formData.append("price", data["price"]);
formData.append("stock", data["stock"]);
if (data["image"].length !== 0) formData.append("image", data["image"][0]);
send(formData);
send(data);
};
return (
<div
......
......@@ -10,7 +10,7 @@ import useSendData from "../../utils/useSendData";
const EditProgram = ({ idProgram }) => {
const url = `${process.env.REACT_APP_BASE_URL}/programs/${idProgram}/`;
const [initialData, errorState] = useFetchSingleData(url);
const [send, error] = useSendData({ url, method: "PATCH" });
const [send, error] = useSendData({ url, method: "PATCH", redirect: -1 });
const onSubmit = (data) => {
const formData = new FormData();
formData.append("name", data["name"]);
......
......@@ -10,7 +10,7 @@ import useSendData from "../../utils/useSendData";
const EditSubkategori = ({ idSubKategori }) => {
const url = `${process.env.REACT_APP_BASE_URL}/subcategories/${idSubKategori}/`;
const [initialData, errorState] = useFetchSingleData(url);
const [send, error] = useSendData({ url, method: "PATCH" });
const [send, error] = useSendData({ url, method: "PATCH", redirect: -1 });
const onSubmit = (data) => {
const formData = new FormData();
formData.append("name", data["name"]);
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment