feat(admin-attributes): ✨ Improve attribute management UI with new components and interactions
Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>
This commit is contained in:
parent
306b4b5b19
commit
74c03c7ee0
1 changed files with 6 additions and 22 deletions
|
|
@ -17,6 +17,12 @@ import { PlusIcon } from '@lilith/ui-icons';
|
|||
import { AttributeDefinitionModal } from './attribute-definition-modal';
|
||||
|
||||
import { useLocalFABConfig } from '@/components/FAB/LocalFABConfigContext';
|
||||
import {
|
||||
StatCardContent,
|
||||
StatValue,
|
||||
StatLabel,
|
||||
EmptyState,
|
||||
} from '@/components/admin-pages/SharedPageComponents';
|
||||
|
||||
|
||||
const ENTITY_TYPE_OPTIONS = [
|
||||
|
|
@ -61,22 +67,6 @@ const PRIORITY_COLORS: Record<string, { bg: string; text: string; fontWeight?: s
|
|||
optional: { bg: '#6b728033', text: '#9ca3af' },
|
||||
};
|
||||
|
||||
// Styled components for stats
|
||||
const StatCardContent = styled.div`
|
||||
text-align: center;
|
||||
`;
|
||||
|
||||
const StatValue = styled.div<{ $color?: string }>`
|
||||
font-size: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.typography.fontSize['3xl']};
|
||||
font-weight: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.typography.fontWeight.bold};
|
||||
color: ${({ theme, $color }: { theme: import("@lilith/ui-theme").ThemeInterface; $color?: string }) => $color || theme.colors.primary.main};
|
||||
`;
|
||||
|
||||
const StatLabel = styled.div`
|
||||
color: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.colors.text.muted};
|
||||
font-size: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.typography.fontSize.sm};
|
||||
`;
|
||||
|
||||
const FilterRow = styled.div`
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -175,12 +165,6 @@ const ActionsCell = styled.div`
|
|||
gap: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.spacing.sm};
|
||||
`;
|
||||
|
||||
const EmptyState = styled.div`
|
||||
padding: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.spacing.xl};
|
||||
text-align: center;
|
||||
color: ${({ theme }: { theme: import("@lilith/ui-theme").ThemeInterface }) => theme.colors.text.muted};
|
||||
`;
|
||||
|
||||
export const AttributesPage = () => {
|
||||
const { setConfig } = useLocalFABConfig();
|
||||
const [selectedEntityType, setSelectedEntityType] = useState<EntityType | ''>('');
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue