Show full political names

web/components/filters/choices.tsx

@@ -11,10 +11,30 @@ export const ROMANTIC_CHOICES = {
   'Open Relationship': 'open',
 };
 
+export const POLITICAL_CHOICES = {
+  Progressive: 'progressive',
+  Liberal: 'liberal',
+  'Moderate / Centrist': 'moderate',
+  Conservative: 'conservative',
+  Socialist: 'socialist',
+  Nationalist: 'nationalist',
+  Populist: 'populist',
+  'Green / Eco-Socialist': 'green',
+  Technocratic: 'technocratic',
+  Libertarian: 'libertarian',
+  'Effective Accelerationism': 'e/acc',
+  'Pause AI / Tech Skeptic': 'pause ai',
+  'Independent / Other': 'other',
+}
+
 export const REVERTED_RELATIONSHIP_CHOICES = Object.fromEntries(
   Object.entries(RELATIONSHIP_CHOICES).map(([key, value]) => [value, key])
 );
 
 export const REVERTED_ROMANTIC_CHOICES = Object.fromEntries(
   Object.entries(ROMANTIC_CHOICES).map(([key, value]) => [value, key])
+);
+
+export const REVERTED_POLITICAL_CHOICES = Object.fromEntries(
+  Object.entries(POLITICAL_CHOICES).map(([key, value]) => [value, key])
 );

web/components/optional-profile-form.tsx

@@ -28,7 +28,7 @@ import {City, CityRow, profileToCity, useCitySearch} from "web/components/search
 import {AddPhotosWidget} from './widgets/add-photos'
 import {RadioToggleGroup} from "web/components/widgets/radio-toggle-group";
 import {MultipleChoiceOptions} from "common/love/multiple-choice";
-import {RELATIONSHIP_CHOICES, ROMANTIC_CHOICES} from "web/components/filters/choices";
+import {POLITICAL_CHOICES, RELATIONSHIP_CHOICES, ROMANTIC_CHOICES} from "web/components/filters/choices";
 import toast from "react-hot-toast";
 
 export const OptionalLoveUserForm = (props: {
@@ -393,21 +393,7 @@ export const OptionalLoveUserForm = (props: {
         <Col className={clsx(colClassName)}>
           <label className={clsx(labelClassName)}>Political beliefs</label>
           <MultiCheckbox
-            choices={{
-              Progressive: 'progressive',
-              Liberal: 'liberal',
-              'Moderate / Centrist': 'moderate',
-              Conservative: 'conservative',
-              Socialist: 'socialist',
-              Nationalist: 'nationalist',
-              Populist: 'populist',
-              'Green / Eco-Socialist': 'green',
-              Technocratic: 'technocratic',
-              Libertarian: 'libertarian',
-              'Effective Accelerationism': 'e/acc',
-              'Pause AI / Tech Skeptic': 'pause ai',
-              'Independent / Other': 'other',
-            }}
+            choices={POLITICAL_CHOICES}
             selected={profile['political_beliefs'] ?? []}
             onChange={(selected) => setProfile('political_beliefs', selected)}
           />

web/components/profile-about.tsx

@@ -2,7 +2,7 @@ import clsx from 'clsx'
 import {convertRelationshipType, type RelationshipType,} from 'web/lib/util/convert-relationship-type'
 import stringOrStringArrayToText from 'web/lib/util/string-or-string-array-to-text'
 import {ReactNode} from 'react'
-import {REVERTED_ROMANTIC_CHOICES} from 'web/components/filters/choices'
+import {REVERTED_POLITICAL_CHOICES, REVERTED_ROMANTIC_CHOICES} from 'web/components/filters/choices'
 import {BiSolidDrink} from 'react-icons/bi'
 import {BsPersonHeart} from 'react-icons/bs'
 import {FaChild} from 'react-icons/fa6'
@@ -60,7 +60,7 @@ export default function ProfileAbout(props: {
       <HasKids profile={profile}/>
       <AboutRow
         icon={<RiScales3Line className="h-5 w-5"/>}
-        text={profile.political_beliefs}
+        text={profile.political_beliefs?.map(belief => REVERTED_POLITICAL_CHOICES[belief])}
       />
       <Education profile={profile}/>
       <Occupation profile={profile}/>