From 5c8e77ebe1d7edebddf6258920b7144bc632d651 Mon Sep 17 00:00:00 2001
From: joostdecock <joost@joost.at>
Date: Sat, 17 Feb 2024 16:53:38 +0100
Subject: [PATCH 1/2] Revert "Revert "fix(shared): Add key prop to iterator""

This reverts commit 147433e16893360e5212773638b1303bf3720c35.
---
 sites/shared/components/curated-sets.mjs | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/sites/shared/components/curated-sets.mjs b/sites/shared/components/curated-sets.mjs
index 0bc421fa2ad..3fa613e4861 100644
--- a/sites/shared/components/curated-sets.mjs
+++ b/sites/shared/components/curated-sets.mjs
@@ -76,9 +76,14 @@ const SetLineup = ({ sets = [], href = false, onClick = false }) => (
       if (onClick) props.onClick = () => onClick(set)
       else if (typeof href === 'function') props.href = href(set.id)
 
-      if (onClick) return <button {...props} key={set.id}></button>
-      else if (href) return <Link {...props} key={set.id}></Link>
-      else return <div {...props} key={set.id}></div>
+      let img = <div {...props} key={set.id}></div>
+      if (onClick) img = <button {...props} key={set.id}></button>
+      else if (href) img = <Link {...props} key={set.id}></Link>
+      return (
+        <SetNameWrapper key={set.id} name={set[`name${capitalize(lang)}`]}>
+          {img}
+        </SetNameWrapper>
+      )
     })}
   </div>
 )

From 96085d7f04e7f221799dadd8be0188a461fa46fd Mon Sep 17 00:00:00 2001
From: joostdecock <joost@joost.at>
Date: Sat, 17 Feb 2024 16:54:37 +0100
Subject: [PATCH 2/2] Revert "Revert "feat(shared): Add name to curated sets""

This reverts commit 43c069719c83bc34b3fff3bc3e38614315e6acf2.
---
 sites/shared/components/curated-sets.mjs | 21 ++++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/sites/shared/components/curated-sets.mjs b/sites/shared/components/curated-sets.mjs
index 3fa613e4861..df7d25b9274 100644
--- a/sites/shared/components/curated-sets.mjs
+++ b/sites/shared/components/curated-sets.mjs
@@ -50,7 +50,14 @@ import {
 
 export const ns = ['account', 'patterns', 'status', 'measurements', 'sets', inputNs]
 
-const SetLineup = ({ sets = [], href = false, onClick = false }) => (
+const SetNameWrapper = ({ name, children }) => (
+  <div className="flex flex-col items-center">
+    {children}
+    <b>{name}</b>
+  </div>
+)
+
+const SetLineup = ({ sets = [], lang, href = false, onClick = false }) => (
   <div
     className={`w-full flex flex-row ${
       sets.length > 1 ? 'justify-start px-8' : 'justify-center'
@@ -79,6 +86,7 @@ const SetLineup = ({ sets = [], href = false, onClick = false }) => (
       let img = <div {...props} key={set.id}></div>
       if (onClick) img = <button {...props} key={set.id}></button>
       else if (href) img = <Link {...props} key={set.id}></Link>
+
       return (
         <SetNameWrapper key={set.id} name={set[`name${capitalize(lang)}`]}>
           {img}
@@ -100,7 +108,7 @@ const ShowCuratedSet = ({ cset }) => {
     <>
       <h2>{cset[`name${capitalize(lang)}`]}</h2>
       <div className="w-full">
-        <SetLineup sets={[cset]} />
+        <SetLineup sets={[cset]} lang={lang} />
       </div>
 
       <div className="flex flex-wrap flex-row gap-2 w-full mt-4 items-center justify-end">
@@ -211,6 +219,8 @@ export const CuratedSets = ({ href = false, clickHandler = false, published = tr
   // Hooks
   const backend = useBackend()
   const { setLoadingStatus } = useContext(LoadingStatusContext)
+  const { i18n } = useTranslation(ns)
+  const lang = i18n.language
 
   // State
   const [sets, setSets] = useState([])
@@ -241,7 +251,7 @@ export const CuratedSets = ({ href = false, clickHandler = false, published = tr
 
   return (
     <div className="max-w-7xl xl:pl-4">
-      <SetLineup {...lineupProps} />
+      <SetLineup {...lineupProps} lang={lang} />
       {selected && <ShowCuratedSet cset={sets[selected]} />}
     </div>
   )
@@ -250,7 +260,8 @@ export const CuratedSets = ({ href = false, clickHandler = false, published = tr
 // Component for the maintaining the list of curated-sets
 export const CuratedSetsList = ({ href = false }) => {
   // Hooks
-  const { t } = useTranslation(ns)
+  const { t, i18n } = useTranslation(ns)
+  const lang = i18n.language
   const backend = useBackend()
   const { setLoadingStatus, LoadingProgress } = useContext(LoadingStatusContext)
   const [refresh, setRefresh] = useState(0)
@@ -376,7 +387,7 @@ export const CuratedSetsList = ({ href = false }) => {
           ))}
         </tbody>
       </table>
-      <SetLineup {...lineupProps} />
+      <SetLineup {...lineupProps} lang={lang} />
     </div>
   )
 }