Skip to content

Commit

Permalink
feat: add global table actions & example table component & more (#769)
Browse files Browse the repository at this point in the history
  • Loading branch information
@a0m0rajab
a0m0rajab authored Oct 16, 2024
2 parents e867023 + 2492781 commit 6213816
Show file tree
Hide file tree
Showing 14 changed files with 546 additions and 538 deletions.
12 changes: 6 additions & 6 deletions apps/web/src/app/[lang]/app/[type]/operations/details/add/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,12 @@ import type { CellContext, ColumnDef } from "@tanstack/react-table";
import { columnsGenerator } from "node_modules/@repo/ayasofyazilim-ui/src/molecules/tables/columnsGenerator";
import { useEffect, useState } from "react";
import { z } from "zod";
import {
getTableData,
getTableDataDetail,
} from "src/app/[lang]/app/actions/table";
import { getResourceDataClient } from "src/language-data/ContractService";
import { useLocale } from "src/providers/locale";
import {
getPartyDetail,
getPartyTableData,
} from "../../../parties/[partyName]/action";
import { createTag } from "../actions";

interface Payment {
Expand Down Expand Up @@ -111,7 +111,7 @@ export default function Page() {
const [travellerNext, setTravellerNext] = useState<boolean>(false);

useEffect(() => {
void getPartyTableData("merchants", 0, 100).then((response) => {
void getTableData("merchants", 0, 100).then((response) => {
if (response.type === "success") {
setMerchantList(response.data);
} else if (response.type === "api-error") {
Expand All @@ -124,7 +124,7 @@ export default function Page() {
const handleMerchantChange = (value: string) => {
setSelectedMerchant(value);
setMerchantDetails(undefined);
void getPartyDetail("merchants", value).then((response) => {
void getTableDataDetail("merchants", value).then((response) => {
if (response.type === "success") {
setMerchantDetails(response.data as MerchantDetailDto);
} else if (response.type === "api-error") {
Expand Down
89 changes: 37 additions & 52 deletions apps/web/src/app/[lang]/app/[type]/parties/[partyName]/[partyId]/individuals-table/form.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,13 @@
"use client";
import type { TableAction } from "@repo/ayasofyazilim-ui/molecules/tables";
import Dashboard from "@repo/ayasofyazilim-ui/templates/dashboard";
"use server";
import { SectionLayoutContent } from "@repo/ayasofyazilim-ui/templates/section-layout-v2";
import TableComponent from "@repo/ui/TableComponent";
import {
AUTO_COLUMNS_DATA,
EDIT_ROW_ON_NEW_PAGE,
getTableDataServerSide,
TableAction_EXPORT_CSV,
} from "@repo/ui/utils/table/table-utils";
import { useRouter } from "next/navigation";
import { useState } from "react";
deleteTableRow,
tableDataRequests,
} from "src/app/[lang]/app/actions/table";
import type { CRMServiceServiceResource } from "src/language-data/CRMService";
import { dataConfigOfParties } from "../../../table-data";
import type { PartiesResultType, PartyNameType } from "../../../types";
import { getPartyIndividualTableData } from "../../action";
import type { PartyNameType } from "../../../types";

function Individual({
languageData,
Expand All @@ -24,50 +18,41 @@ function Individual({
partyName: Exclude<PartyNameType, "individuals">;
partyId: string;
}) {
const router = useRouter();
const formData = dataConfigOfParties[partyName];
const [tableData, setTableData] = useState<PartiesResultType>();
const [isLoading, setIsLoading] = useState(true);
const columnsData = AUTO_COLUMNS_DATA(formData);
function getData() {
setIsLoading(true);
void getTableDataServerSide(async () => {
return await getPartyIndividualTableData(partyName, partyId);
}).then((result) => {
if (result) {
setTableData(result);
}
setIsLoading(false);
});
}

columnsData.data.actionList?.push(
EDIT_ROW_ON_NEW_PAGE(
languageData,
`/app/admin/parties/${partyName}`,
router,
),
);

const action: TableAction[] = [
TableAction_EXPORT_CSV<PartiesResultType | undefined>(
tableData,
`${partyName}.csv`,
),
];

return (
<SectionLayoutContent sectionId="individuals">
<Dashboard
action={action}
cards={[]}
columnsData={columnsData}
data={tableData?.items || []}
fetchRequest={getData}
isLoading={isLoading}
rowCount={tableData?.totalCount || 0}
withCards={false}
withTable
<TableComponent
deleteRequest={async (id) => {
"use server";
const response = await deleteTableRow(partyName, id);
return response;
}}
deleteableRow
editOnNewPage
editOnNewPageUrl={`/app/admin/parties/${partyName}`}
// createOnNewPage
// createOnNewPageTitle={languageData[`${formData.subEntityName}.New`]}
// createOnNewPageUrl={`/app/admin/parties/individuals/new?parentId=${partyId}&partyName=${partyName}`}
fetchRequest={async (page) => {
"use server";
const requests = await tableDataRequests();
const response = await requests[partyName].getIndivuals({
id: partyId,
maxResultCount: 10,
skipCount: page * 10,
});

return {
type: "success",
data: {
items: response.items || [],
totalCount: response.totalCount || 0,
},
};
}}
languageData={languageData}
tableSchema={formData.tableSchema}
/>
</SectionLayoutContent>
);
Expand Down
68 changes: 33 additions & 35 deletions apps/web/src/app/[lang]/app/[type]/parties/[partyName]/[partyId]/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,15 @@
"use server";

import { SectionLayout } from "@repo/ayasofyazilim-ui/templates/section-layout-v2";
import { notFound } from "next/navigation";
import {
getTableData,
getTableDataDetail,
} from "src/app/[lang]/app/actions/table";
import { getResourceData } from "src/language-data/CRMService";
import { getCities } from "../../../action";
import { dataConfigOfParties } from "../../table-data";
import type { PartyNameType } from "../../types";
import { getPartyDetail, getPartyTableData } from "../action";
import Address from "./address/form";
import Email from "./email/form";
import Individual from "./individuals-table/form";
Expand All @@ -15,49 +19,54 @@ import OrganizationForm from "./organization/form";
import PersonalSummariesForm from "./personal-summaries/form";
import SubCompany from "./subcompanies-table/form";
import Telephone from "./telephone/form";
import type { GetPartiesDetailResult } from "./types";

export default async function Page({
params,
}: {
params: {
partyId: string;
partyName: PartyNameType;
partyName: Exclude<PartyNameType, "individuals">;
lang: string;
};
}) {
const { languageData } = await getResourceData(params.lang);
const formData = dataConfigOfParties[params.partyName];
const taxOffices = await getPartyTableData("tax-offices", 0, 100);

if (params.partyName === "individuals") {
return <></>;
}

const partyDetail = await getPartyDetail(params.partyName, params.partyId);
const cities = await getCities({ maxResultCount: 500, sorting: "name" });

if (
partyDetail.type !== "success" ||
!partyDetail.data ||
cities.type !== "success" ||
!("entityInformations" in partyDetail.data) ||
taxOffices.type !== "success"
) {
return <>Not found</>;
const partyDetail = await getTableDataDetail(
params.partyName,
params.partyId,
);
if (partyDetail.type !== "success" || !partyDetail.data) {
notFound();
}

const partyDetailData = partyDetail.data;

const partyDetailData = partyDetail.data as GetPartiesDetailResult;
const organizationData =
partyDetailData.entityInformations?.[0]?.organizations?.[0];

const individualData =
partyDetailData.entityInformations?.[0]?.individuals?.[0];

if (!organizationData && !individualData) {
return <>Not found org</>;
return notFound();
}

const cities = await getCities({ maxResultCount: 500, sorting: "name" });
const citiesEnum =
(cities.type === "success" &&
cities.data.items?.map((item) => ({
name: item.name || "",
id: item.id || "",
}))) ||
[];

const taxOffices = await getTableData("tax-offices", 0);
const taxOfficesEnum =
(taxOffices.type === "success" &&
taxOffices.data.items?.map((item) => ({
name: item.name || "",
id: item.id || "",
}))) ||
[];

const sections = [
{ name: languageData.Telephone, id: "telephone" },
{ name: languageData.Address, id: "address" },
Expand Down Expand Up @@ -85,17 +94,6 @@ export default async function Page({
});
}

const citiesEnum =
cities.data.items?.map((item) => ({
name: item.name || "",
id: item.id || "",
})) || [];
const taxOfficesEnum =
taxOffices.data.items?.map((item) => ({
name: item.name || "",
id: item.id || "",
})) || [];

return (
<>
<div className="h-full overflow-hidden">
Expand Down
97 changes: 36 additions & 61 deletions apps/web/src/app/[lang]/app/[type]/parties/[partyName]/[partyId]/subcompanies-table/form.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,13 @@
"use client";
import type { TableAction } from "@repo/ayasofyazilim-ui/molecules/tables";
import Dashboard from "@repo/ayasofyazilim-ui/templates/dashboard";
"use server";
import { SectionLayoutContent } from "@repo/ayasofyazilim-ui/templates/section-layout-v2";
import TableComponent from "@repo/ui/TableComponent";
import {
AUTO_COLUMNS_DATA,
EDIT_ROW_ON_NEW_PAGE,
getTableDataServerSide,
TableAction_CREATE_ROW_ON_NEW_PAGE,
TableAction_EXPORT_CSV,
} from "@repo/ui/utils/table/table-utils";
import { useRouter } from "next/navigation";
import { useState } from "react";
deleteTableRow,
tableDataRequests,
} from "src/app/[lang]/app/actions/table";
import type { CRMServiceServiceResource } from "src/language-data/CRMService";
import { dataConfigOfParties } from "../../../table-data";
import type { PartiesResultType, PartyNameType } from "../../../types";
import { getPartySubTableData } from "../../action";
import type { PartyNameType } from "../../../types";

function SubCompany({
languageData,
Expand All @@ -25,58 +18,40 @@ function SubCompany({
partyName: Exclude<PartyNameType, "individuals">;
partyId: string;
}) {
const router = useRouter();
const formData = dataConfigOfParties[partyName];
const [tableData, setTableData] = useState<PartiesResultType>();
const [isLoading, setIsLoading] = useState(true);
const columnsData = AUTO_COLUMNS_DATA(formData);
function getData() {
setIsLoading(true);
void getTableDataServerSide(async () => {
return await getPartySubTableData(partyName, partyId);
}).then((result) => {
if (result) {
setTableData(result);
}
setIsLoading(false);
});
}

columnsData.data.actionList?.push(
EDIT_ROW_ON_NEW_PAGE(
languageData,
`/app/admin/parties/${partyName}`,
router,
),
);

const action: TableAction[] = [
TableAction_EXPORT_CSV<PartiesResultType | undefined>(
tableData,
`${partyName}.csv`,
),
];
// if (formData.createFormSchema) {
action.unshift(
TableAction_CREATE_ROW_ON_NEW_PAGE(
languageData,
{ ...formData, translationKey: formData.subEntityName },
`/app/admin/parties/${partyName}/new?parentId=${partyId}`,
),
);
// }
return (
<SectionLayoutContent sectionId="SubCompany">
<Dashboard
action={action}
cards={[]}
columnsData={columnsData}
data={tableData?.items || []}
fetchRequest={getData}
isLoading={isLoading}
rowCount={tableData?.totalCount || 0}
withCards={false}
withTable
<TableComponent
createOnNewPage
createOnNewPageTitle={languageData[`${formData.subEntityName}.New`]}
createOnNewPageUrl={`/app/admin/parties/${partyName}/new?parentId=${partyId}`}
deleteRequest={async (id) => {
"use server";
const response = await deleteTableRow(partyName, id);
return response;
}}
deleteableRow
editOnNewPage
editOnNewPageUrl={`/app/admin/parties/${partyName}`}
fetchRequest={async (page) => {
"use server";
const requests = await tableDataRequests();
const response = await requests[partyName].getSubCompanies({
id: partyId,
maxResultCount: 10,
skipCount: page * 10,
});
return {
type: "success",
data: {
items: response.items || [],
totalCount: response.totalCount || 0,
},
};
}}
languageData={languageData}
tableSchema={formData.tableSchema}
/>
</SectionLayoutContent>
);
Expand Down
Loading

0 comments on commit 6213816

Please sign in to comment.