## TODO - [ ] add dropdown to use records from outside the context - [x] add loader for files chip - [x] add roleId where it's necessary - [x] Split AvatarChip in two components. One with the icon that will call the second with leftComponent. - [ ] Fix tests - [x] Fix UI regression on Search
29 lines
934 B
TypeScript
29 lines
934 B
TypeScript
import { AttachmentType } from '@/activities/files/types/Attachment';
|
|
import { IconMapping, useFileTypeColors } from '@/file/utils/fileIconMappings';
|
|
import { useTheme } from '@emotion/react';
|
|
import styled from '@emotion/styled';
|
|
|
|
const StyledIconContainer = styled.div<{ background: string }>`
|
|
align-items: center;
|
|
background: ${({ background }) => background};
|
|
border-radius: ${({ theme }) => theme.border.radius.sm};
|
|
color: ${({ theme }) => theme.grayScale.gray0};
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
justify-content: center;
|
|
padding: ${({ theme }) => theme.spacing(1.25)};
|
|
`;
|
|
|
|
export const FileIcon = ({ fileType }: { fileType: AttachmentType }) => {
|
|
const theme = useTheme();
|
|
const iconColors = useFileTypeColors();
|
|
|
|
const Icon = IconMapping[fileType];
|
|
|
|
return (
|
|
<StyledIconContainer background={iconColors[fileType]}>
|
|
{Icon && <Icon size={theme.icon.size.sm} />}
|
|
</StyledIconContainer>
|
|
);
|
|
};
|