Function WorkspacesTable

site/src/pages/WorkspacesPage/WorkspacesTable.tsx:101–305

({
	workspaces,
	checkedWorkspaces,
	isUsingFilter,
	onCheckChange,
	templates,
	canCreateTemplate,
	onActionSuccess,
	onActionError,
	chatsByWorkspace,
})

}

export const WorkspacesTable: FC<WorkspacesTableProps> = ({
	workspaces,
	checkedWorkspaces,
	isUsingFilter,
	onCheckChange,
	templates,
	canCreateTemplate,
	onActionSuccess,
	onActionError,
	chatsByWorkspace,
}) => {
	const dashboard = useDashboard();
	const isLoading = !workspaces;
	const isEmpty = workspaces && workspaces.length === 0;
	const hideHeaders = isLoading || isEmpty;

	return (
		<Table>
			<TableHeader>
				<TableRow>
					<TableHead className="w-1/3">
						{isLoading ? (
							<Skeleton className="h-4 w-40" />
						) : (
							<div
								className={cn(
									"flex items-center gap-5",
									isEmpty && "invisible",
								)}
							>
								<Checkbox
									disabled={isEmpty}
									checked={
										!isEmpty && checkedWorkspaces.length === workspaces.length
									}
									onCheckedChange={(checked) => {
										if (!checked) {
											onCheckChange([]);
										} else {
											onCheckChange(workspaces);
										}
									}}
									aria-label="Select all workspaces"
									className="my-0"
								/>
								Name
							</div>
						)}
					</TableHead>
					<TableHead className={cn("w-1/3", hideHeaders && "invisible")}>
						Template
					</TableHead>
					<TableHead className={cn("w-1/3", hideHeaders && "invisible")}>
						Status
					</TableHead>
					<TableHead className="w-0">
						<span className="sr-only">Actions</span>
					</TableHead>