feat: enhance ConferencesItem and ConferencesCard components with improved date handling and subtitle display

Author: medyo

src/features/cards/components/conferencesCard/ConferenceItem.tsx

@@ -83,8 +83,10 @@ const ConferencesItem = ({ item, index, analyticsTag }: BaseItemPropsType<Confer
               [Attributes.LINK]: item.url,
               [Attributes.SOURCE]: analyticsTag,
             }}>
-            <span className="rowTitleIcon">{conferenceLocation?.icon}</span>
-            {item.title}
+            <div className="subTitle">
+              {differenceInDays < 0 && <span className="blockHeaderBadge past">Ended</span>}{' '}
+              <span className="rowTitleIcon">{conferenceLocation?.icon}</span> {item.title}
+            </div>
           </CardLink>
           {listingMode === 'normal' ? (
             <>
@@ -98,7 +100,7 @@ const ConferencesItem = ({ item, index, analyticsTag }: BaseItemPropsType<Confer
                     ? `In ${differenceInDays} days, ${conferenceDate}`
                     : differenceInDays === 0
                     ? `Ongoing, ${conferenceDate}`
-                    : `${conferenceDate} (ended)`}
+                    : `${conferenceDate}`}
                 </span>
               </div>
               <div className="rowDetails">

src/features/cards/components/conferencesCard/ConferencesCard.tsx

@@ -1,3 +1,4 @@
+import { useMemo } from 'react'
 import { Card } from 'src/components/Elements'
 import { ListConferenceComponent } from 'src/components/List/ListConferenceComponent'
 import { useUserPreferences } from 'src/stores/preferences'
@@ -10,8 +11,13 @@ export function ConferencesCard(props: CardPropsType) {
   const { meta } = props
   const cardSettings = useUserPreferences((state) => state.cardsSettings?.[meta.value])
   const { userSelectedTags } = useUserPreferences()
+
+  const selectedTag = useMemo(() => {
+    return userSelectedTags.find((lang) => lang.value === cardSettings?.language)
+  }, [userSelectedTags, cardSettings])
+
   const { isLoading, data: results } = useGetConferences({
-    tags: userSelectedTags.map((tag) => tag.value),
+    tags: selectedTag ? [selectedTag.value] : userSelectedTags.map((tag) => tag.value),
   })
 
   const renderItem = (item: Conference, index: number) => (