Updated session profile page. Added TypeIcon component. Added useRegionNames hook.

src/components/hooks/index.ts

@@ -32,6 +32,7 @@ export * from './useLocale';
 export * from './useMessages';
 export * from './useModified';
 export * from './useNavigation';
+export * from './useRegionNames';
 export * from './useSticky';
 export * from './useTeamUrl';
 export * from './useTheme';

src/components/hooks/useCountryNames.ts

@@ -28,7 +28,7 @@ export function useCountryNames(locale: string) {
     }
   }, [locale]);
 
-  return list;
+  return { countryNames: list };
 }
 
 export default useCountryNames;

src/components/hooks/useFormat.ts

@@ -7,7 +7,7 @@ import regions from '../../../public/iso-3166-2.json';
 export function useFormat() {
   const { formatMessage, labels } = useMessages();
   const { locale } = useLocale();
-  const countryNames = useCountryNames(locale);
+  const { countryNames } = useCountryNames(locale);
 
   const formatOS = (value: string): string => {
     return OS_NAMES[value] || value;

src/components/hooks/useRegionNames.ts

@@ -0,0 +1,19 @@
+import useCountryNames from './useCountryNames';
+import regions from '../../../public/iso-3166-2.json';
+
+export function useRegionNames(locale: string) {
+  const { countryNames } = useCountryNames(locale);
+
+  const getRegionName = (regionCode: string, countryCode?: string) => {
+    if (!countryCode) {
+      return regions[regionCode];
+    }
+
+    const region = regionCode.includes('-') ? regionCode : `${countryCode}-${regionCode}`;
+    return regions[region] ? `${regions[region]}, ${countryNames[countryCode]}` : region;
+  };
+
+  return { regionNames: regions, getRegionName };
+}
+
+export default useRegionNames;