SoapboxMount: break SoapboxLoad into a separate component

app/soapbox/hooks/index.ts

@@ -3,6 +3,7 @@ export { useAppDispatch } from './useAppDispatch';
 export { useAppSelector } from './useAppSelector';
 export { useDimensions } from './useDimensions';
 export { useFeatures } from './useFeatures';
+export { useLocale } from './useLocale';
 export { useOnScreen } from './useOnScreen';
 export { useOwnAccount } from './useOwnAccount';
 export { useRefEventHandler } from './useRefEventHandler';

app/soapbox/hooks/useLocale.ts

@@ -0,0 +1,16 @@
+import MESSAGES from 'soapbox/locales/messages';
+
+import { useSettings } from './useSettings';
+
+/** Ensure the given locale exists in our codebase */
+const validLocale = (locale: string): boolean => Object.keys(MESSAGES).includes(locale);
+
+/** Get valid locale from settings. */
+const useLocale = (fallback = 'en') => {
+  const settings = useSettings();
+  const locale = settings.get('locale');
+
+  return validLocale(locale) ? locale : fallback;
+};
+
+export { useLocale };