fix: defining a variable for the default language

Author: mikasackermn

widget/playground/src/constants/languages.ts

@@ -35,6 +35,8 @@ import {
   Vietnamese,
 } from '@rango-dev/ui';
 
+export const DEFAULT_LANGUAGE = 'en';
+
 export const LANGUAGES = [
   { name: 'Afrikaans', value: 'af', Icon: SouthAfrica },
   { name: 'Arabic', value: 'ar', Icon: SaudiArabia },
@@ -44,7 +46,7 @@ export const LANGUAGES = [
   { name: 'Chinese (Traditional)', value: 'zh-TW', Icon: Chinese },
   { name: 'Danish', value: 'da', Icon: Denmark },
   { name: 'Dutch', value: 'nl', Icon: Netherlands },
-  { name: 'English', value: 'en', Icon: English },
+  { name: 'English', value: DEFAULT_LANGUAGE, Icon: English },
   { name: 'Filipino', value: 'fil', Icon: Philippines },
   { name: 'Finnish', value: 'fi', Icon: Finland },
   { name: 'French', value: 'fr', Icon: French },

widget/playground/src/containers/StyleLayout/StyleLayout.General.tsx

@@ -18,6 +18,7 @@ import { OverlayPanel } from '../../components/OverlayPanel';
 import { SingleList } from '../../components/SingleList';
 import { Slider } from '../../components/Slider';
 import {
+  DEFAULT_LANGUAGE,
   DEFAULT_PRIMARY_RADIUS,
   DEFAULT_SECONDARY_RADIUS,
   LANGUAGES,
@@ -47,7 +48,7 @@ export function General() {
     useConfigStore.use.config().theme?.secondaryBorderRadius;
   const fontFamily =
     useConfigStore.use.config().theme?.fontFamily || DEFAULT_FONT;
-  const enLanguage = LANGUAGES.find((lng) => lng.value === 'en');
+  const enLanguage = LANGUAGES.find((lng) => lng.value === DEFAULT_LANGUAGE);
   const language = useConfigStore.use.config().language || enLanguage?.value;
   const variant = useConfigStore.use.config().variant || VARIANTS[0].value;