Skip to content

Commit

Permalink
feat: add colors to profile tags
Browse files Browse the repository at this point in the history
  • Loading branch information
benfurber committed Nov 12, 2024
1 parent 2b1b6c0 commit 1ea5ad4
Show file tree
Hide file tree
Showing 3 changed files with 57 additions and 3 deletions.
20 changes: 17 additions & 3 deletions packages/components/src/ProfileTagsList/ProfileTagsList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,21 +2,35 @@ import { Flex } from 'theme-ui'

import { Category } from '../Category/Category'

import type { ITag } from 'oa-shared'
import type { IProfileTag } from 'oa-shared'
import type { ThemeUIStyleObject } from 'theme-ui'

export interface IProps {
tags: ITag[]
tags: IProfileTag[]
sx?: ThemeUIStyleObject | undefined
}

const DEFAULT_COLOR = '#999999'

export const ProfileTagsList = ({ sx, tags }: IProps) => {
return (
<Flex data-cy="ProfileTagsList" sx={{ gap: 2, flexWrap: 'wrap', ...sx }}>
{tags.map(
(tag, index) =>
tag?.label && (
<Category key={index} category={{ label: tag.label }} />
<Category
key={index}
category={{ label: tag.label }}
sx={{
borderRadius: 99,
border: '1px solid',
borderColor: tag.color ? tag.color : DEFAULT_COLOR,
backgroundColor: tag.color
? `${tag.color}20`
: `${DEFAULT_COLOR}20`,
color: tag.color ? tag.color : DEFAULT_COLOR,
}}
/>
),
)}
</Flex>
Expand Down
39 changes: 39 additions & 0 deletions shared/data/profileTags.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,90 +11,103 @@ export const allCommunityProfileTags: AllCommunityProfileTags = {
_id: 'jnZ72xyFyDC4TLxqnTMU',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Sheetpress',
profileType: 'space',
},
{
_id: 'uJjCjWXyxCTUpyN49cpX',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Injection',
profileType: 'space',
},
{
_id: 'zXzMjchujzQaUfsoeY76',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Extrusion',
profileType: 'space',
},
{
_id: 'eE9E6FULYhojFFR7P8v6',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Shredder',
profileType: 'space',
},
{
_id: 'dbyGKDv4JHcGAenVrQWZ',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Mixed',
profileType: 'space',
},
{
_id: 'uywNKPCo8THUoFvieqVj',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Collection',
profileType: 'space',
},
{
_id: 'kpKfYH9pxCCEXwcN7MFK',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Drop Off Point',
profileType: 'space',
},
{
_id: 'JkkWrAm7aBiNuNLrAzev',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Granulating',
profileType: 'space',
},
{
_id: 'DBECpXdx8aine8ZCTkQW',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#8EC685',
label: 'Host Events',
profileType: 'space',
},
{
_id: 'jNpbhaQHotptC6hkfy9T',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#8EC685',
label: 'Research & Development',
profileType: 'space',
},
{
_id: 'y66sfcMhAdBb23aV96YT',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#8EC685',
label: 'Consultancy',
profileType: 'space',
},
{
_id: 'uER9eUfEgzUpfr4mAwAc',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#8EC685',
label: 'Documentation',
profileType: 'space',
},
{
_id: '4yRoYXvbapvhgQmb6W4M',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#8EC685',
label: 'Meetups',
profileType: 'space',
},
Expand All @@ -103,82 +116,94 @@ export const allCommunityProfileTags: AllCommunityProfileTags = {
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
label: 'Drop Off Point',
color: '#8EC685',
profileType: 'space',
},
{
_id: 'uCzWZbz3aVKyx2keoqRi',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
label: 'Wire Electronics',
color: '#F29195',
profileType: 'space',
},
{
_id: 'J3LF7fMsDfniYT2ZX3rf',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Machining',
profileType: 'space',
},
{
_id: 'QvxszeiUqy867CaVc7Kh',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Welding',
profileType: 'space',
},
{
_id: '6h3fWCv3AXGJ4bVr3Foc',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Assembling',
profileType: 'space',
},
{
_id: 'FhtRoqZvQYYaN6CN2txJ',
_created: '2018-01-01T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Mould Making',
profileType: 'space',
},
{
_id: '4ax6TzzVsAtG6Au8nEXJ',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'PET',
profileType: 'space',
},
{
_id: 'farYGhuqJc6wrAwa2xyx',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'HDPE',
profileType: 'space',
},
{
_id: 'XjBLmxaYi2Hu3H2n4QBw',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'PVC',
profileType: 'space',
},
{
_id: 'HDNJjX4ohKFfM7YznEpL',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'LDPE',
profileType: 'space',
},
{
_id: 'P7pk8KAQwzqHLqhGUvoy',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'PP',
profileType: 'space',
},
{
_id: '3PLMJ7mXxZFRqrTLcM2h',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'PS',
profileType: 'space',
},
Expand Down Expand Up @@ -314,97 +339,111 @@ export const allCommunityProfileTags: AllCommunityProfileTags = {
_id: 'Jk7ZWUTqmqoKJazNQPeD',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Repair',
profileType: 'space',
},
{
_id: 'J47xug9KUt94w6uDFNvL',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Upgrade',
profileType: 'space',
},
{
_id: 'cE7fCfHFmYQ7iW6JR4gc',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#20B7EB',
label: 'Recolor',
profileType: 'space',
},
{
_id: 'nsK2ToECJav6ZkMTWZAb',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'Organise Meetups',
profileType: 'space',
},
{
_id: 'ChzXxbgy6ccYN9r2sNxQ',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'Research & Development',
profileType: 'space',
},
{
_id: 'ZYwwtL6EMdRcJTcLjhAV',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'Documentation',
profileType: 'space',
},
{
_id: 'iXqCtQ8jovBZj8rtEpoV',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'Consultancy',
profileType: 'space',
},
{
_id: '6RZGBY3bvV6rdLaU8GYe',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#BAA0CC',
label: 'Give Workshops',
profileType: 'space',
},
{
_id: 'tTWGjtcWjyZnG9uF2ZRq',
_created: '2018-01-02T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Collection',
profileType: 'space',
},
{
_id: 'FqXQfCa3aeHj6aWNEKLQ',
_created: '2019-01-02T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Sewing',
profileType: 'member',
},
{
_id: 'wqkjfGl9mnGcUdLXbVpd',
_created: '2019-01-02T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Patching',
profileType: 'member',
},
{
_id: '4QefHzjx8i2ThBUVsRjP',
_created: '2019-01-02T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'UX/UI Design',
profileType: 'member',
},
{
_id: 'RgBexJM2wH3sHDBBvdzx',
_created: '2019-01-02T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Product Design',
profileType: 'member',
},
{
_id: '78Bnk77THwDAsvDrhFJX',
_created: '2019-01-02T00:00:00.001Z',
_deleted: false,
color: '#F29195',
label: 'Graphic Design',
profileType: 'member',
},
Expand Down
1 change: 1 addition & 0 deletions shared/models/tags.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,4 +23,5 @@ export interface ITag extends DBDoc {

export interface IProfileTag extends ITag {
profileType: MemberOrSpace
color?: string
}

0 comments on commit 1ea5ad4

Please sign in to comment.