diff --git a/devcon-app/src/components/domain/app/dc7/sessions/index.tsx b/devcon-app/src/components/domain/app/dc7/sessions/index.tsx index 2f5981ea8..6f66dedca 100644 --- a/devcon-app/src/components/domain/app/dc7/sessions/index.tsx +++ b/devcon-app/src/components/domain/app/dc7/sessions/index.tsx @@ -66,12 +66,18 @@ import PenIcon from 'assets/icons/pen.svg' import QuestionsIcon from 'assets/icons/questions.svg' import { Button } from 'lib/components/button' +export const tagClassTwo = (active?: boolean, className?: string) => + cn( + 'shrink-0 select-none cursor-pointer mr-2 rounded-full bg-white border border-solid border-[#E1E4EA] px-3 py-1 text-xs flex items-center justify-center text-[black] hover:border-[black] font-semibold hover:text-black transition-all duration-300', + active ? 'border-[#ac9fdf] !bg-[#EFEBFF]' : '', + className + ) export const cardClass = 'flex flex-col lg:border lg:border-solid lg:border-[#E4E6EB] rounded-3xl relative lg:bg-[#fbfbfb]' export const tagClass = (active: boolean, className?: string) => cn( 'shrink-0 select-none cursor-pointer rounded-full bg-white border border-solid border-[#E1E4EA] px-3 py-1 text-xs flex items-center justify-center text-[#717784] hover:text-black transition-all duration-300', - active ? ' border-[#ac9fdf] !bg-[#EFEBFF]' : '', + active ? ' border-[#ac9fdf] bg-[#EFEBFF]' : '', className ) @@ -91,10 +97,16 @@ const useSessionFilter = (sessions: SessionType[], event: any) => { return { type: [...new Set(sessions.map(session => session.type))].filter(Boolean), day: ['All', 'Nov 12', 'Nov 13', 'Nov 14', 'Nov 15'], - expertise: ['Beginner', 'Intermediate', 'Expert', ...new Set(sessions.map(session => session.expertise))].filter( - Boolean - ), - track: [...new Set(sessions.map(session => session.track))].filter(Boolean), + expertise: [ + ...new Set( + ['Beginner', 'Intermediate', 'Expert'] + .concat(...sessions.map((session: any) => session.expertise)) + .filter(Boolean) + ), + ], + track: [...new Set(sessions.map(session => session.track))] + .filter(Boolean) + .filter(track => !track.startsWith('[CLS]')), room: [...new Set(sessions.map(session => session.room))].filter(Boolean), other: ['Attending', 'Interested In', 'Upcoming', 'Past'], } @@ -151,25 +163,25 @@ const getExpertiseColor = (expertise: string) => { const getTrackColor = (track: string) => { switch (track) { case 'Core Protocol': - return 'bg-[#F6F2FF]' + return '!bg-[#F6F2FF]' case 'Cypherpunk & Privacy': - return 'bg-[#FFF4FF]' + return '!bg-[#FFF4FF]' case 'Usability': - return 'bg-[#FFF4F4]' + return '!bg-[#FFF4F4]' case 'Real World Ethereum': - return 'bg-[#FFEDDF]' + return '!bg-[#FFEDDF]' case 'Applied Cryptography': - return 'bg-[#FFFEF4]' + return '!bg-[#FFFEF4]' case 'Cryptoeconomics': - return 'bg-[#F9FFDF]' + return '!bg-[#F9FFDF]' case 'Coordination': - return 'bg-[#E9FFD7]' + return '!bg-[#E9FFD7]' case 'Developer Experience': - return 'bg-[#E8FDFF]' + return '!bg-[#E8FDFF]' case 'Security': - return 'bg-[#E4EEFF]' + return '!bg-[#E4EEFF]' case 'Layer 2': - return 'bg-[#F0F1FF]' + return '!bg-[#F0F1FF]' default: return 'bg-[white]' // Light Gray (default color) } @@ -227,16 +239,19 @@ const ExpertiseTag = ({ expertise, className }: { expertise: string; className?: ) } -const TrackTag = ({ track, className }: { track: string; className?: string }) => { +const TrackTag = ({ track, className, applyColor = true, ...rest }: any) => { + if (!track) return null + return (
{session.type} - {session.slot_roomId}
@@ -439,7 +454,7 @@ export const SessionFilterAdvanced = ({ filterOptions }: { filterOptions: any }) {filterOptions.type.map((type: string) => (