From dcf24138d153f3b90ee30e3ae3901b9f96943eed Mon Sep 17 00:00:00 2001
From: Joe Banks <joe@jb3.dev>
Date: Thu, 11 Jul 2024 03:00:17 +0100
Subject: Re-map slugged vote options to human form when upstreaming to form

---
 src/components/InputTypes/Vote.tsx | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/components/InputTypes/Vote.tsx b/src/components/InputTypes/Vote.tsx
index 67a7cac..c630d8c 100644
--- a/src/components/InputTypes/Vote.tsx
+++ b/src/components/InputTypes/Vote.tsx
@@ -146,10 +146,12 @@ const CardList = React.memo(function CardList({
     cards,
     questionId,
     handler,
+    reverseMap
 }: {
     cards: string[];
     questionId: string;
     handler: VoteProps["handler"];
+    reverseMap: Record<string, string>;
 }) {
     const votes = useSelector<
         { vote: VoteSliceState },
@@ -161,7 +163,15 @@ const CardList = React.memo(function CardList({
     });
 
     useEffect(() => {
-        handler(votes);
+        if (!votes) {
+            return;
+        }
+
+        const updated = Object.fromEntries(
+            Object.entries(votes).map(([slug, vote]) => [reverseMap[slug], vote])
+        );
+
+        handler(updated);
     }, [votes]);
 
     if (votes) {
@@ -211,6 +221,10 @@ export default function Vote(props: VoteProps): JSX.Element {
         );
     }, [props.questionId]);
 
+    const reverseMap = Object.fromEntries(props.options.map(value => {
+        return [slugify(value), value];
+    }));
+
     const COPY = "Use the buttons to organise options into your preferred order. You can have multiple options with the same ranking. Additionally, you can leave some or all options as \"No preference\" if you do not wish to order them.";
 
     return (
@@ -220,6 +234,7 @@ export default function Vote(props: VoteProps): JSX.Element {
                 questionId={props.questionId}
                 handler={props.handler}
                 cards={state.cards}
+                reverseMap={reverseMap}
             />
         </div>
     );
-- 
cgit v1.2.3