yashwin/Qassure-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: Replace document action dropdown with status-specific buttons and simplify supplier table layout.

Browse Source
This commit is contained in:
Yashwin 2026-03-27 16:39:48 +05:30
parent 79004fc75e
commit 254bc9f40e
2 changed files with 54 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/pages/tenant/Suppliers.tsx
View File

@ -13,14 +13,14 @@ const Suppliers = (): ReactElement => {
>
<div className="flex flex-col gap-6">
<div className="border border-[rgba(0,0,0,0.08)] rounded-lg bg-white overflow-hidden p-4 md:p-6">
<div className="flex flex-col gap-4">
<div className="flex items-center justify-between">
{/* <div className="flex flex-col gap-4"> */}
{/* <div className="flex items-center justify-between">
<h2 className="text-lg font-semibold text-[#0f1724]">
Suppliers
</h2>
</div>
<SuppliersTable showHeader={true} compact={false} />
</div>
</div> */}
<SuppliersTable showHeader={true} compact={false} />
{/* </div> */}
</div>
</div>
</Layout>

87
src/pages/tenant/ViewDocument.tsx
View File

@ -1,4 +1,4 @@
import { useEffect, useMemo, useState, type ReactElement } from "react";
import { useEffect, useState, type ReactElement } from "react";
import { useNavigate, useParams } from "react-router-dom";
import { Layout } from "@/components/layout/Layout";
import {
@ -14,7 +14,7 @@ import { documentService, type FileAttachmentItem } from "@/services/document-se
import { workflowService } from "@/services/workflow-service";
import type { DocumentDetail, DocumentVersion } from "@/types/document";
import { showToast } from "@/utils/toast";
import { ChevronDown, Paperclip, Plus } from "lucide-react";
import { Paperclip, Plus } from "lucide-react";
const formatDateTime = (value?: string | null): string => {
if (!value) return "-";
@ -56,7 +56,7 @@ const ViewDocument = (): ReactElement => {
const [activeTab, setActiveTab] = useState<"overview" | "version-history">(
"overview",
);
const [actionMenuOpen, setActionMenuOpen] = useState(false);
const [activeAction, setActiveAction] = useState<DocumentAction | null>(null);
const [isActionLoading, setIsActionLoading] = useState(false);
const [workflowDefinitionId, setWorkflowDefinitionId] = useState("");
@ -182,7 +182,6 @@ const ViewDocument = (): ReactElement => {
};
const openActionModal = async (action: DocumentAction): Promise<void> => {
setActionMenuOpen(false);
if (action === "checkin") {
await handleAction(action);
return;
@ -332,18 +331,7 @@ const ViewDocument = (): ReactElement => {
},
];
const actionOptions: DocumentAction[] = useMemo(
() => [
"submit",
"approve",
"reject",
"effective",
"obsolete",
"checkout",
"checkin",
],
[],
);
return (
<Layout
@ -373,28 +361,51 @@ const ViewDocument = (): ReactElement => {
{document?.document_number || "-"}
</p>
</div>
<div className="relative">
<button
type="button"
className="inline-flex items-center gap-2 h-9 px-3 rounded-md border border-[rgba(0,0,0,0.12)] text-xs text-[#0f1724]"
onClick={() => setActionMenuOpen((prev) => !prev)}
>
Actions
<ChevronDown className="w-3.5 h-3.5" />
</button>
{actionMenuOpen && (
<div className="absolute right-0 top-10 z-20 bg-white border border-[rgba(0,0,0,0.08)] rounded-md shadow-md min-w-[180px]">
{actionOptions.map((action) => (
<button
key={action}
type="button"
className="w-full text-left px-3 py-2 text-xs text-[#0f1724] hover:bg-[#f8fafc]"
onClick={() => void openActionModal(action)}
>
{ACTION_LABELS[action]}
</button>
))}
</div>
<div className="flex items-center gap-2">
{document?.status === "draft" && (
<button
type="button"
className="inline-flex items-center gap-2 h-9 px-4 rounded-md bg-[#084cc8] text-white text-xs font-medium hover:bg-[#063a99]"
onClick={() => void openActionModal("submit")}
>
{ACTION_LABELS["submit"]}
</button>
)}
{document?.status === "in_review" && (
<>
<button
type="button"
className="inline-flex items-center gap-2 h-9 px-4 rounded-md bg-emerald-600 text-white text-xs font-medium hover:bg-emerald-700"
onClick={() => void openActionModal("approve")}
>
{ACTION_LABELS["approve"]}
</button>
<button
type="button"
className="inline-flex items-center gap-2 h-9 px-4 rounded-md bg-red-600 text-white text-xs font-medium hover:bg-red-700"
onClick={() => void openActionModal("reject")}
>
{ACTION_LABELS["reject"]}
</button>
</>
)}
{document?.status === "approved" && (
<button
type="button"
className="inline-flex items-center gap-2 h-9 px-4 rounded-md bg-[#084cc8] text-white text-xs font-medium hover:bg-[#063a99]"
onClick={() => void openActionModal("effective")}
>
{ACTION_LABELS["effective"]}
</button>
)}
{document?.status === "effective" && (
<button
type="button"
className="inline-flex items-center gap-2 h-9 px-4 rounded-md border border-red-200 text-red-600 bg-red-50 text-xs font-medium hover:bg-red-100"
onClick={() => void openActionModal("obsolete")}
>
{ACTION_LABELS["obsolete"]}
</button>
)}
</div>
</div>