1d49fc7ac7
- Integrated multi-language functionality across various user management components, including user list, roles list, and user authorization pages, enhancing accessibility for diverse users. - Updated UI elements to utilize translation keys, ensuring that all text is dynamically translated based on user preferences. - Improved error handling messages to be localized, providing a better user experience in case of issues. These changes significantly enhance the usability and internationalization of the user management features, making the application more inclusive.
43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { Plus } from "lucide-react";
|
|
import { CompanySearchFilter } from "@/types/company";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
interface CompanyToolbarProps {
|
|
searchFilter: CompanySearchFilter;
|
|
totalCount: number;
|
|
filteredCount: number;
|
|
onSearchChange: (filter: Partial<CompanySearchFilter>) => void;
|
|
onSearchClear: () => void;
|
|
onCreateClick: () => void;
|
|
t?: (key: string, params?: Record<string, string | number>) => string;
|
|
}
|
|
|
|
/**
|
|
* 회사 관리 툴바 컴포넌트
|
|
* 검색, 필터링, 등록 기능 제공
|
|
*/
|
|
export function CompanyToolbar({ totalCount, onCreateClick, t }: CompanyToolbarProps) {
|
|
const _t = t || ((key: string) => {
|
|
const defaults: Record<string, string> = {
|
|
"company.toolbar.total": "총",
|
|
"company.toolbar.create": "회사 등록",
|
|
};
|
|
return defaults[key] || key;
|
|
});
|
|
|
|
return (
|
|
<div className="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
|
|
{/* 왼쪽: 카운트 정보 */}
|
|
<div className="text-sm text-muted-foreground">
|
|
{_t("company.toolbar.total")} <span className="font-semibold text-foreground">{totalCount.toLocaleString()}</span> 건
|
|
</div>
|
|
|
|
{/* 오른쪽: 등록 버튼 */}
|
|
<Button onClick={onCreateClick} className="h-10 w-full gap-2 text-sm font-medium lg:w-auto">
|
|
<Plus className="h-4 w-4" />
|
|
{_t("company.toolbar.create")}
|
|
</Button>
|
|
</div>
|
|
);
|
|
}
|