Backport admin-ui changes of mike

Author: pozylon

admin-ui/requirements.md admin-ui/PRD.mdadmin-ui/requirements.md renamed to admin-ui/PRD.md

@@ -1000,5 +1000,16 @@
   "worker.successCount": null,
   "workers": null,
   "ordered": null,
-  "registered": null
+  "registered": null,
+  "all_works": null,
+  "click_to_copy": null,
+  "filter.options": null,
+  "message_status_processing": null,
+  "message_status_sending": null,
+  "message_status_sent": null,
+  "message_status_undeliverable": null,
+  "messages": null,
+  "no_retries": null,
+  "retry_remaining": null,
+  "all_workers": null
 }

admin-ui/src/i18n/de.json

@@ -45,6 +45,7 @@
   "address_line_2": "Address line 2",
   "address_notice": "This information will be displayed publicly so be careful what you share.",
   "all": "All",
+  "all_workers": "All Workers",
   "allocate_work": "Allocate Work",
   "already_got_a_user": "Already got a user?",
   "apply": "Apply",
@@ -132,6 +133,7 @@
   "children_count": "{count} children",
   "city": "City",
   "clear_history": "Clear History",
+  "click_to_copy": "Click to copy ID",
   "close": "Close",
   "close_sidebar": "Close sidebar",
   "code": "Code",
@@ -167,7 +169,7 @@
   "contract-address-label": "Contract Address",
   "contract-standard": "Contract standard",
   "contract_address": "Contract Address",
-  "copied": "Copied",
+  "copied": "Copied!",
   "copilot": "Copilot",
   "copilot-into-message": "Hello! Please introduce yourself and explain what you can help me with in managing my Unchained Commerce store. Be friendly and informative about your current capabilities.",
   "copilot_welcome_description": "Your AI assistant is ready to help you manage your Unchained Commerce store.",
@@ -293,7 +295,6 @@
   "delivery_providers": "Delivery providers",
   "delivery_status": "Status",
   "description": "Description",
-  "detail": "Detail",
   "dimensions": "Dimensions",
   "discount": "Discount",
   "discount_amount": "Discount Amount",
@@ -391,7 +392,7 @@
   "filter.active": "Active",
   "filter.created": "Created",
   "filter.inactive": "Inactive",
-  "filter.noOptions": "No options",
+  "filter.options": "Options",
   "filter.sortKey": "Sort",
   "filter.updated": "Updated",
   "filter_activated": "Filter activated!",
@@ -530,6 +531,11 @@
   "media_title": "Title:",
   "media_updated": "Media updated",
   "message": "Message",
+  "message_status_processing": "Processing",
+  "message_status_sending": "Sending",
+  "message_status_sent": "Sent",
+  "message_status_undeliverable": "Undeliverable",
+  "messages": "Messages",
   "method": "Method",
   "mobile_phone": "Mobile phone",
   "name": "Name",
@@ -558,6 +564,7 @@
   "no_payload": "Payload",
   "no_price": "N/A",
   "no_result_found": "No result found",
+  "no_retries": "No retries",
   "no_statistics_available": "No statistics available",
   "no_tag": "No Tag",
   "no_users_found": "No users found",
@@ -738,6 +745,7 @@
   "retry": "Retry Connection",
   "retry-work": "Retry",
   "retry_prompt": "Retry",
+  "retry_remaining": "retry",
   "review": "Review",
   "review_data": "Review data",
   "review_deleted": "Review deleted successfully",
@@ -960,16 +968,13 @@
   "with_children": "With Children",
   "work_added_success": "Work added successfully!",
   "work_allocated_success": "Allocate work successfully!",
-  "work_count_header": "{count} Work Items",
   "work_created": "Created",
   "work_deleted": "Work deleted successfully",
   "work_detail": "Work Detail",
   "work_detail_title": "Work {id}",
   "work_finished": "Finished",
-  "work_header": "1 Work Item",
   "work_management_setting_list_header": "Work Management Settings",
   "work_original": "Original Work",
-  "work_page_title": "{count, plural, one {# Work Item} other {# Work Items}}",
   "work_priority": "Priority",
   "work_queue": "Work queue",
   "work_queue_header": "Work queue",

admin-ui/src/i18n/en.json

@@ -138,6 +138,9 @@
   "all": {
     "defaultMessage": "All"
   },
+  "all_workers": {
+    "defaultMessage": "All Workers"
+  },
   "allocate_work": {
     "defaultMessage": "Allocate Work"
   },
@@ -399,6 +402,9 @@
   "clear_history": {
     "defaultMessage": "Clear History"
   },
+  "click_to_copy": {
+    "defaultMessage": "Click to copy ID"
+  },
   "close": {
     "defaultMessage": "Close"
   },
@@ -505,7 +511,7 @@
     "defaultMessage": "Contract Address"
   },
   "copied": {
-    "defaultMessage": "Copied"
+    "defaultMessage": "Copied!"
   },
   "copilot": {
     "defaultMessage": "Copilot"
@@ -882,9 +888,6 @@
   "description": {
     "defaultMessage": "Description"
   },
-  "detail": {
-    "defaultMessage": "Detail"
-  },
   "dimensions": {
     "defaultMessage": "Dimensions"
   },
@@ -1176,8 +1179,8 @@
   "filter.inactive": {
     "defaultMessage": "Inactive"
   },
-  "filter.noOptions": {
-    "defaultMessage": "No options"
+  "filter.options": {
+    "defaultMessage": "Options"
   },
   "filter.sortKey": {
     "defaultMessage": "Sort"
@@ -1597,6 +1600,21 @@
   "message": {
     "defaultMessage": "Message"
   },
+  "message_status_processing": {
+    "defaultMessage": "Processing"
+  },
+  "message_status_sending": {
+    "defaultMessage": "Sending"
+  },
+  "message_status_sent": {
+    "defaultMessage": "Sent"
+  },
+  "message_status_undeliverable": {
+    "defaultMessage": "Undeliverable"
+  },
+  "messages": {
+    "defaultMessage": "Messages"
+  },
   "method": {
     "defaultMessage": "Method"
   },
@@ -1681,6 +1699,9 @@
   "no_result_found": {
     "defaultMessage": "No result found"
   },
+  "no_retries": {
+    "defaultMessage": "No retries"
+  },
   "no_statistics_available": {
     "defaultMessage": "No statistics available"
   },
@@ -2221,6 +2242,9 @@
   "retry_prompt": {
     "defaultMessage": "Retry"
   },
+  "retry_remaining": {
+    "defaultMessage": "retry"
+  },
   "review": {
     "defaultMessage": "Review"
   },
@@ -2887,9 +2911,6 @@
   "work_allocated_success": {
     "defaultMessage": "Allocate work successfully!"
   },
-  "work_count_header": {
-    "defaultMessage": "{count} Work Items"
-  },
   "work_created": {
     "defaultMessage": "Created"
   },
@@ -2905,18 +2926,12 @@
   "work_finished": {
     "defaultMessage": "Finished"
   },
-  "work_header": {
-    "defaultMessage": "1 Work Item"
-  },
   "work_management_setting_list_header": {
     "defaultMessage": "Work Management Settings"
   },
   "work_original": {
     "defaultMessage": "Original Work"
   },
-  "work_page_title": {
-    "defaultMessage": "{count, plural, one {# Work Item} other {# Work Items}}"
-  },
   "work_priority": {
     "defaultMessage": "Priority"
   },

admin-ui/src/lang/en.json

@@ -14,11 +14,13 @@ import useAuth from '../../Auth/useAuth';
 import FormWrapper from '../../common/components/FormWrapper';
 import MarkdownTextAreaField from '../../forms/components/MarkdownTextAreaField';
 import useApp from '../../common/hooks/useApp';
+import useShopInfo from '../../common/hooks/useShopInfo';
 
 const AssortmentTextForm = ({ assortmentId }) => {
   const { formatMessage } = useIntl();
   const { hasRole } = useAuth();
-  const { selectedLocale } = useApp();
+  const { defaultLocale, shopInfo, loading: shopInfoLoading } = useShopInfo();
+  const { selectedLocale, setSelectedLocale, languageDialectList } = useApp();
 
   const { translatedAssortmentTexts, loading } = useTranslatedAssortmentTexts({
     assortmentId,
@@ -81,6 +83,40 @@ const AssortmentTextForm = ({ assortmentId }) => {
     }
   }, [translatedAssortmentTexts, selectedLocale, loading]);
 
+  useEffect(() => {
+    if (shopInfo && translatedAssortmentTexts?.length) {
+      if (
+        translatedAssortmentTexts?.find(
+          ({ locale }) => locale === selectedLocale,
+        )
+      ) {
+        return;
+      }
+      if (
+        defaultLocale &&
+        translatedAssortmentTexts?.find(
+          ({ locale }) => locale === defaultLocale,
+        )
+      ) {
+        setSelectedLocale(defaultLocale);
+      } else if (
+        defaultLocale &&
+        translatedAssortmentTexts?.find(
+          ({ locale }) => locale === defaultLocale.split('-')[0],
+        )
+      ) {
+        setSelectedLocale(defaultLocale.split('-')[0]);
+      } else {
+        const firstAvailableText = translatedAssortmentTexts?.find(
+          ({ locale }) =>
+            locale &&
+            languageDialectList?.find(({ isoCode }) => isoCode === locale),
+        );
+        setSelectedLocale(firstAvailableText.locale);
+      }
+    }
+  }, [shopInfoLoading, translatedAssortmentTexts]);
+
   return (
     <SelfDocumentingView
       documentationLabel={formatMessage({

admin-ui/src/modules/assortment/components/AssortmentTextForm.tsx

@@ -3,6 +3,17 @@ import { useIntl } from 'react-intl';
 import useLanguages from '../../language/hooks/useLanguages';
 import useCountries from '../../country/hooks/useCountries';
 import useShopInfo from '../hooks/useShopInfo';
+import useLocalStorage from '../hooks/useLocalStorage';
+
+const isSupportedLocale = (locale) => {
+  try {
+    const dtf = new Intl.DateTimeFormat(locale);
+    const resolved = dtf.resolvedOptions().locale;
+    return resolved.toLowerCase() === locale.toLowerCase();
+  } catch (e) {
+    return false;
+  }
+};
 
 interface AppContextProps {
   selectedLocale: string;
@@ -12,18 +23,20 @@ interface AppContextProps {
 }
 
 const AppContext = createContext<AppContextProps | undefined>(undefined);
-
 const createLanguageDialectList = (languages, countries) => {
   const result = [];
 
   languages.forEach(({ _id: languageId, isoCode: baseIsoCode }) => {
     result.push({ _id: languageId, isoCode: baseIsoCode });
     countries.forEach(({ isoCode: countryIsoCode, _id: countryId }) => {
-      const dialectIsoCode = `${baseIsoCode}-${countryIsoCode.toUpperCase()}`;
-      result.push({
-        _id: `${countryId}-${languageId}`,
-        isoCode: dialectIsoCode,
-      });
+      const dialectIsoCode = [baseIsoCode, countryIsoCode.toUpperCase()].join(
+        '-',
+      );
+      if (isSupportedLocale(dialectIsoCode))
+        result.push({
+          _id: `${countryId}-${languageId}`,
+          isoCode: dialectIsoCode,
+        });
     });
   });
 
@@ -38,16 +51,29 @@ export const AppContextWrapper = ({
   onlyFull?: boolean;
 }) => {
   const { languages } = useLanguages();
+  const { locale } = useIntl();
+  const [storedLocale, setStoredLocale] = useLocalStorage(
+    'selectedLocale',
+    null,
+  );
   const { shopInfo, loading: shopInfoLoading } = useShopInfo();
   const { countries } = useCountries();
-  const { locale } = useIntl();
 
   const [selectedLocale, setSelectedLocale] = useState<string>(locale);
+  const setSelectedLocaleWrapper = (newLocale: string) => {
+    setStoredLocale(newLocale);
+    setSelectedLocale(newLocale);
+  };
 
   useEffect(() => {
+    if (storedLocale) {
+      setSelectedLocale(storedLocale);
+
+      return;
+    }
     if (!shopInfoLoading) {
       const baseLanguage = `${shopInfo?.language?.isoCode}-${shopInfo?.country?.isoCode?.toUpperCase()}`;
-      setSelectedLocale(baseLanguage);
+      setSelectedLocaleWrapper(baseLanguage);
     }
   }, [shopInfo, shopInfoLoading, locale]);
 
@@ -60,7 +86,7 @@ export const AppContextWrapper = ({
     <AppContext.Provider
       value={{
         selectedLocale,
-        setSelectedLocale,
+        setSelectedLocale: setSelectedLocaleWrapper,
         languageDialectList,
         isSystemReady,
       }}

admin-ui/src/modules/common/components/AppContext.tsx

@@ -7,8 +7,6 @@ import useApp from '../hooks/useApp';
 
 const LocaleWrapper = ({ children, onlyFull = false }) => {
   const { languageDialectList, selectedLocale, setSelectedLocale } = useApp();
-
-  const { locale } = useIntl();
   const isInsideFormWrapper = useContext(FormWrapperContext);
 
   const displayedLanguages = languageDialectList.filter(

admin-ui/src/modules/common/components/LocaleWrapper.tsx

@@ -45,8 +45,15 @@ const useShopInfo = () => {
   >(ShopInfoQuery, {
     fetchPolicy: 'cache-first',
   });
+  const { shopInfo } = data || {};
   return {
-    shopInfo: data?.shopInfo,
+    shopInfo,
+    defaultLocale: [
+      shopInfo?.language?.isoCode,
+      shopInfo?.country?.isoCode?.toUpperCase(),
+    ]
+      ?.filter(Boolean)
+      ?.join('-'),
     loading,
     error,
   };