Client: FormGallery: Fixed methods

packages/client/src/pages/FormGallery/Header.js

@@ -149,31 +149,49 @@ export default inject(
     clientLoadingStore,
     infoPanelStore,
   }) => {
+    const {
+      getCategoryTitle,
+      oformFromFolderId,
+      currentCategory,
+      fetchCurrentCategory,
+      setGallerySelected,
+      oformsLoadError,
+    } = oformsStore;
+
+    const { getFolderInfo } = filesStore;
+    const { canSubmitToFormGallery } = accessRightsStore;
+    const { setSubmitToGalleryDialogVisible } = dialogsStore;
+    const { isVisible, setIsVisible } = infoPanelStore;
+    const {
+      setIsSectionHeaderLoading,
+      setIsSectionFilterLoading,
+      setIsSectionBodyLoading,
+    } = clientLoadingStore;
+
     return {
-      getCategoryTitle: oformsStore.getCategoryTitle,
+      getCategoryTitle,
 
-      oformFromFolderId: oformsStore.oformFromFolderId,
+      oformFromFolderId,
 
-      currentCategory: oformsStore.currentCategory,
-      fetchCurrentCategory: oformsStore.fetchCurrentCategory,
+      currentCategory,
+      fetchCurrentCategory,
 
-      setGallerySelected: oformsStore.setGallerySelected,
+      setGallerySelected,
 
-      canSubmitToFormGallery: accessRightsStore.canSubmitToFormGallery,
-      setSubmitToGalleryDialogVisible:
-        dialogsStore.setSubmitToGalleryDialogVisible,
+      canSubmitToFormGallery,
+      setSubmitToGalleryDialogVisible,
 
-      isInfoPanelVisible: infoPanelStore.isVisible,
-      setIsInfoPanelVisible: infoPanelStore.setIsVisible,
+      isInfoPanelVisible: isVisible,
+      setIsInfoPanelVisible: setIsVisible,
 
       setIsLoading: () => {
-        clientLoadingStore.setIsSectionHeaderLoading(true, false);
-        clientLoadingStore.setIsSectionFilterLoading(true, false);
-        clientLoadingStore.setIsSectionBodyLoading(true, false);
+        setIsSectionHeaderLoading(true, false);
+        setIsSectionFilterLoading(true, false);
+        setIsSectionBodyLoading(true, false);
       },
 
-      oformsLoadError: oformsStore.oformsLoadError,
-      getFolderInfo: filesStore.getFolderInfo,
+      oformsLoadError,
+      getFolderInfo,
     };
   },
 )(withTranslation("Common")(observer(SectionHeaderContent)));

packages/client/src/pages/FormGallery/index.js

@@ -39,13 +39,13 @@ import Dialogs from "./Dialogs";
 import ErrorView from "./ErrorView";
 import SectionWrapper from "SRC_DIR/components/Section";
 const FormGallery = ({
-  oformsLoadError,
   currentCategory,
-  fetchCurrentCategory,
   defaultOformLocale,
-  fetchOformLocales,
-  oformsFilter,
+  fetchCurrentCategory,
   fetchOforms,
+  fetchOformsLocales,
+  oformsFilter,
+  oformsLoadError,
   setOformFromFolderId,
 }) => {
   const location = useLocation();
@@ -57,7 +57,7 @@ const FormGallery = ({
   useEffect(() => {
     const firstLoadFilter = OformsFilter.getFilter(location);
 
-    Promise.all([fetchOforms(firstLoadFilter), fetchOformLocales()]).finally(
+    Promise.all([fetchOforms(firstLoadFilter), fetchOformsLocales()]).finally(
       () => {
         setIsInitLoading(false);
       },
@@ -127,18 +127,28 @@ const FormGallery = ({
   );
 };
 
-export default inject(({ oformsStore }) => ({
-  oformsLoadError: oformsStore.oformsLoadError,
+export default inject(({ oformsStore }) => {
+  const {
+    currentCategory,
+    defaultOformLocale,
+    fetchCurrentCategory,
+    fetchOforms,
+    fetchOformsLocales,
+    oformsFilter,
+    oformsLoadError,
+    setOformFromFolderId,
+    setOformsFilter,
+  } = oformsStore;
 
-  currentCategory: oformsStore.currentCategory,
-  fetchCurrentCategory: oformsStore.fetchCurrentCategory,
-
-  defaultOformLocale: oformsStore.defaultOformLocale,
-  fetchOformLocales: oformsStore.fetchOformLocales,
-
-  oformsFilter: oformsStore.oformsFilter,
-  setOformsFilter: oformsStore.setOformsFilter,
-
-  fetchOforms: oformsStore.fetchOforms,
-  setOformFromFolderId: oformsStore.setOformFromFolderId,
-}))(observer(FormGallery));
+  return {
+    currentCategory,
+    defaultOformLocale,
+    fetchCurrentCategory,
+    fetchOforms,
+    fetchOformsLocales,
+    oformsFilter,
+    oformsLoadError,
+    setOformFromFolderId,
+    setOformsFilter,
+  };
+})(observer(FormGallery));

packages/client/src/store/OformsStore.ts

@@ -25,57 +25,73 @@
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
 import { makeAutoObservable, runInAction } from "mobx";
-
 import OformsFilter from "@docspace/shared/api/oforms/filter";
 import {
-  getGuideLinkByLocale,
-  submitToGallery,
-} from "@docspace/shared/api/oforms";
-
-import {
-  getOformLocales,
-  getOforms,
+  getCategoriesOfCategoryType,
   getCategoryById,
   getCategoryTypes,
-  getCategoriesOfCategoryType,
+  getGuideLinkByLocale,
+  getOformsLocales,
+  getOforms,
+  submitToGallery,
 } from "@docspace/shared/api/oforms";
 import { toastr } from "@docspace/shared/components/toast";
-
 import { convertToLanguage } from "@docspace/shared/utils/common";
 import { LANGUAGE } from "@docspace/shared/constants";
 import { getCookie } from "@docspace/shared/utils/cookie";
 import { combineUrl } from "@docspace/shared/utils/combineUrl";
+import { SettingsStore } from "@docspace/shared/store/SettingsStore";
+import { UserStore } from "@docspace/shared/store/UserStore";
+import { TFormGallery } from "@docspace/shared/api/settings/types";
+import {
+  TOformFile,
+  TOformCategoryType,
+} from "@docspace/shared/api/oforms/types";
 
-const myDocumentsFolderId = 2;
+import InfoPanelStore from "./InfoPanelStore";
 
 class OformsStore {
-  settingsStore;
-  infoPanelStore;
-  userStore = null;
+  settingsStore: SettingsStore | null = null;
+
+  infoPanelStore: InfoPanelStore | null = null;
+
+  userStore: UserStore | null = null;
+
+  oformFiles: TOformFile[] = [];
 
-  oformFiles = null;
   gallerySelected = null;
+
   oformsIsLoading = false;
+
   oformsLoadError = false;
 
   oformsFilter = OformsFilter.getDefault();
 
-  oformFromFolderId = myDocumentsFolderId;
+  oformFromFolderId: string | null = null;
 
   currentCategory = null;
-  categoryTitles = [];
 
-  oformLocales = null;
+  categoryTitles: string[] | undefined = [];
+
+  oformLocales: string[] | undefined = [];
+
   filterOformsByLocaleIsLoading = false;
+
   categoryFilterLoaded = false;
+
   languageFilterLoaded = false;
+
   oformFilesLoaded = false;
 
   submitToGalleryTileIsVisible = !localStorage.getItem(
     "submitToGalleryTileIsHidden",
   );
 
-  constructor(settingsStore, infoPanelStore, userStore) {
+  constructor(
+    settingsStore: SettingsStore,
+    infoPanelStore: InfoPanelStore,
+    userStore: UserStore,
+  ) {
     this.settingsStore = settingsStore;
     this.infoPanelStore = infoPanelStore;
     this.userStore = userStore;
@@ -84,69 +100,80 @@ class OformsStore {
 
   get defaultOformLocale() {
     const userLocale =
-      getCookie(LANGUAGE) || this.userStore.user?.cultureName || "en";
+      getCookie(LANGUAGE) || this.userStore?.user?.cultureName || "en";
     const convertedLocale = convertToLanguage(userLocale);
 
-    return this.oformLocales?.includes(convertedLocale)
+    return this.oformLocales?.includes(convertedLocale as string)
       ? convertedLocale
       : "en";
   }
 
-  setOformFiles = (oformFiles) => (this.oformFiles = oformFiles);
+  setOformFiles = (oformFiles: TOformFile[]) => (this.oformFiles = oformFiles);
 
-  setOformsFilter = (oformsFilter) => (this.oformsFilter = oformsFilter);
+  setOformsFilter = (oformsFilter: OformsFilter) =>
+    (this.oformsFilter = oformsFilter);
 
-  setOformsCurrentCategory = (currentCategory) =>
+  setOformsCurrentCategory = (currentCategory: null) =>
     (this.currentCategory = currentCategory);
 
-  setOformFromFolderId = (oformFromFolderId) => {
+  setOformFromFolderId = (oformFromFolderId: string) => {
     this.oformFromFolderId = oformFromFolderId;
   };
 
-  setOformsIsLoading = (oformsIsLoading) =>
+  setOformsIsLoading = (oformsIsLoading: boolean) =>
     (this.oformsIsLoading = oformsIsLoading);
 
-  setGallerySelected = (gallerySelected) => {
+  setGallerySelected = (gallerySelected: null) => {
     this.gallerySelected = gallerySelected;
-    this.infoPanelStore.setInfoPanelSelection(gallerySelected);
+    this.infoPanelStore?.setInfoPanelSelection(gallerySelected);
   };
 
-  setOformLocales = (oformLocales) => (this.oformLocales = oformLocales);
+  setOformsLocales = (oformLocales: string[]) =>
+    (this.oformLocales = oformLocales);
 
-  setFilterOformsByLocaleIsLoading = (filterOformsByLocaleIsLoading) => {
+  setFilterOformsByLocaleIsLoading = (
+    filterOformsByLocaleIsLoading: boolean,
+  ) => {
     this.filterOformsByLocaleIsLoading = filterOformsByLocaleIsLoading;
   };
 
-  setCategoryFilterLoaded = (categoryFilterLoaded) => {
+  setCategoryFilterLoaded = (categoryFilterLoaded: boolean) => {
     this.categoryFilterLoaded = categoryFilterLoaded;
   };
 
-  setLanguageFilterLoaded = (languageFilterLoaded) => {
+  setLanguageFilterLoaded = (languageFilterLoaded: boolean) => {
     this.languageFilterLoaded = languageFilterLoaded;
   };
 
-  setOformFilesLoaded = (oformFilesLoaded) => {
+  setOformFilesLoaded = (oformFilesLoaded: boolean) => {
     this.oformFilesLoaded = oformFilesLoaded;
   };
 
-  fetchOformLocales = async () => {
-    const { uploadDomain, uploadDashboard } = this.settingsStore.formGallery;
+  setOformsLoadError = (oformsLoadError: boolean) => {
+    this.oformsLoadError = oformsLoadError;
+  };
+
+  fetchOformsLocales = async () => {
+    const { uploadDomain, uploadDashboard } = this.settingsStore
+      ?.formGallery as TFormGallery;
 
     const url = combineUrl(uploadDomain, uploadDashboard, "/i18n/locales");
 
     try {
-      const fetchedLocales = await getOformLocales(url);
-      const localeKeys = fetchedLocales.map((locale) => locale.code);
-      this.setOformLocales(localeKeys);
-    } catch (err) {
-      this.setOformLocales([]);
+      const fetchedLocales = await getOformsLocales(url);
+      const localeKeys = fetchedLocales?.map((locale) => locale.code);
+      this.setOformsLocales(localeKeys);
+    } catch (e) {
+      const error = e as { message: string };
 
-      err?.message !== "Network Error" && toastr.error(err);
+      this.setOformsLocales([]);
+
+      if (error.message !== "Network Error") toastr.error(error);
     }
   };
 
   getOforms = async (filter = OformsFilter.getDefault()) => {
-    const { domain, path } = this.settingsStore.formGallery;
+    const { domain, path } = this.settingsStore?.formGallery as TFormGallery;
 
     const formName = "&fields[0]=name_form";
     const updatedAt = "&fields[1]=updatedAt";
@@ -162,17 +189,21 @@ class OformsStore {
 
     try {
       const oforms = await getOforms(apiUrl);
-      this.oformsLoadError = false;
+      this.setOformsLoadError(true);
       return oforms;
-    } catch (err) {
+    } catch (e) {
+      const err = e as {
+        response: { data: { error: { message: string } }; status: number };
+      };
       const status = err?.response?.status;
       const isApiError = status === 404 || status === 500;
-      //console.log({ err, isApiError });
       if (isApiError) {
-        this.oformsLoadError = true;
+        this.setOformsLoadError(false);
       } else {
         toastr.error(err);
       }
+    } finally {
+      this.setOformsLoadError(false);
     }
 
     return null;
@@ -180,8 +211,9 @@ class OformsStore {
 
   fetchOforms = async (filter = OformsFilter.getDefault()) => {
     const oformData = await this.getOforms(filter);
+    const paginationData = oformData?.meta?.pagination;
+    const forms = oformData?.data ?? [];
 
-    const paginationData = oformData?.data?.meta?.pagination;
     if (paginationData) {
       filter.page = paginationData.page;
       filter.total = paginationData.total;
@@ -189,7 +221,7 @@ class OformsStore {
 
     runInAction(() => {
       this.setOformsFilter(filter);
-      this.setOformFiles(oformData?.data?.data ?? []);
+      this.setOformFiles(forms);
     });
   };
 
@@ -200,8 +232,8 @@ class OformsStore {
     const newOformsFilter = this.oformsFilter.clone();
     newOformsFilter.page += 1;
 
-    const oformData = await this.getOforms(newOformsFilter, true);
-    const newForms = oformData?.data?.data ?? [];
+    const oformData = await this.getOforms(newOformsFilter);
+    const newForms = oformData?.data ?? [];
 
     runInAction(() => {
       this.setOformsFilter(newOformsFilter);
@@ -210,7 +242,7 @@ class OformsStore {
     });
   };
 
-  getTypeOfCategory = (category) => {
+  getTypeOfCategory = (category: string) => {
     if (!category) return;
 
     const [categoryType] = this.categoryTitles.filter(
@@ -220,7 +252,10 @@ class OformsStore {
     return categoryType;
   };
 
-  getCategoryTitle = (category, locale = this.defaultOformLocale) => {
+  getCategoryTitle = (
+    category: TOformCategoryType,
+    locale: string | undefined = this.defaultOformLocale,
+  ) => {
     if (!category) return "";
 
     const categoryType = this.getTypeOfCategory(category);
@@ -232,8 +267,14 @@ class OformsStore {
     return localizedCategory?.attributes[categoryType] || categoryTitle;
   };
 
-  submitToFormGallery = async (file, formName, language, signal = null) => {
-    const { uploadDomain, uploadPath } = this.settingsStore.formGallery;
+  submitToFormGallery = async (
+    file,
+    formName: string,
+    language: string,
+    signal = null,
+  ) => {
+    const { uploadDomain, uploadPath } = this.settingsStore
+      ?.formGallery as TFormGallery;
 
     const res = await submitToGallery(
       combineUrl(uploadDomain, uploadPath),
@@ -246,9 +287,10 @@ class OformsStore {
   };
 
   fetchCurrentCategory = async () => {
-    const { uploadDomain, uploadDashboard } = this.settingsStore.formGallery;
+    const { uploadDomain, uploadDashboard } = this.settingsStore
+      ?.formGallery as TFormGallery;
     const { categorizeBy, categoryId } = this.oformsFilter;
-    const locale = this.defaultOformLocale;
+    const locale = this.defaultOformLocale as string;
 
     if (!categorizeBy || !categoryId) {
       this.currentCategory = null;
@@ -266,26 +308,31 @@ class OformsStore {
   };
 
   fetchCategoryTypes = async () => {
-    const { uploadDomain, uploadDashboard } = this.settingsStore.formGallery;
+    const { uploadDomain, uploadDashboard } = this.settingsStore
+      ?.formGallery as TFormGallery;
 
     const url = combineUrl(uploadDomain, uploadDashboard, "/menu-translations");
     const locale = this.defaultOformLocale;
 
     try {
       const menuItems = await getCategoryTypes(url, locale);
-      this.categoryTitles = menuItems.map(
+
+      this.categoryTitles = menuItems?.map(
         (item) => item.attributes.categoryTitle,
       );
       return menuItems;
-    } catch (err) {
-      err?.message !== "Network Error" && toastr.error(err);
+    } catch (e) {
+      const error = e as { message: string };
+
+      if (error.message !== "Network Error") toastr.error(error);
     }
 
     return null;
   };
 
-  fetchCategoriesOfCategoryType = async (categoryTypeId) => {
-    const { uploadDomain, uploadDashboard } = this.settingsStore.formGallery;
+  fetchCategoriesOfCategoryType = async (categoryTypeId: string) => {
+    const { uploadDomain, uploadDashboard } = this.settingsStore
+      ?.formGallery as TFormGallery;
 
     const url = combineUrl(uploadDomain, uploadDashboard, `/${categoryTypeId}`);
 
@@ -297,13 +344,14 @@ class OformsStore {
   };
 
   fetchGuideLink = async (locale = this.defaultOformLocale) => {
-    const { uploadDomain, uploadDashboard } = this.settingsStore.formGallery;
+    const { uploadDomain, uploadDashboard } = this.settingsStore
+      ?.formGallery as TFormGallery;
     const url = combineUrl(uploadDomain, uploadDashboard, `/blog-links`);
     const guideLink = await getGuideLinkByLocale(url, locale);
     return guideLink;
   };
 
-  filterOformsByCategory = (categorizeBy, categoryId) => {
+  filterOformsByCategory = (categorizeBy: string, categoryId: string) => {
     if (!categorizeBy || !categoryId) this.currentCategory = null;
 
     this.oformsFilter.page = 1;
@@ -314,7 +362,7 @@ class OformsStore {
     runInAction(() => this.fetchOforms(newOformsFilter));
   };
 
-  filterOformsByLocale = async (locale, icon) => {
+  filterOformsByLocale = async (locale: string, icon: string) => {
     if (!locale) return;
 
     if (locale !== this.oformsFilter.locale)
@@ -332,7 +380,7 @@ class OformsStore {
     runInAction(() => this.fetchOforms(newOformsFilter));
   };
 
-  filterOformsBySearch = (search) => {
+  filterOformsBySearch = (search: string) => {
     this.oformsFilter.page = 1;
     this.oformsFilter.search = search;
     const newOformsFilter = this.oformsFilter.clone();
@@ -340,7 +388,7 @@ class OformsStore {
     runInAction(() => this.fetchOforms(newOformsFilter));
   };
 
-  sortOforms = (sortBy, sortOrder) => {
+  sortOforms = (sortBy: string, sortOrder: string) => {
     if (!sortBy || !sortOrder) return;
 
     this.oformsFilter.page = 1;
@@ -354,13 +402,13 @@ class OformsStore {
   resetFilters = () => {
     this.currentCategory = null;
     const newOformsFilter = OformsFilter.getDefault();
-    newOformsFilter.locale = this.defaultOformLocale;
+    newOformsFilter.locale = this.defaultOformLocale as string;
 
     runInAction(() => this.fetchOforms(newOformsFilter));
   };
 
   hideSubmitToGalleryTile = () => {
-    localStorage.setItem("submitToGalleryTileIsHidden", true);
+    localStorage.setItem("submitToGalleryTileIsHidden", "true");
     this.submitToGalleryTileIsVisible = false;
   };
 
@@ -373,7 +421,7 @@ class OformsStore {
   }
 
   get hasMoreForms() {
-    return this.oformFiles.length < this.oformsFilterTotal;
+    return this.oformFiles?.length < this.oformsFilterTotal;
   }
 }
 

packages/shared/api/oforms/filter.ts

@@ -24,7 +24,7 @@
 // content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
-import { toUrlParams } from "../../utils/common";
+import { toUrlParams, getObjectByLocation } from "../../utils/common";
 
 const PAGE = "pagination[page]";
 const PAGE_SIZE = "pagination[pageSize]";
@@ -39,7 +39,7 @@ const SORT_ORDER = "sortorder";
 const DEFAULT_PAGE = 1;
 const DEFAULT_PAGE_SIZE = 150;
 const DEFAULT_TOTAL = 0;
-const DEFAULT_LOCALE = null;
+const DEFAULT_LOCALE = "";
 const DEFAULT_SEARCH = "";
 const DEFAULT_SORT_BY = "";
 const DEFAULT_SORT_ORDER = "";
@@ -47,6 +47,24 @@ const DEFAULT_CATEGORIZE_BY = "";
 const DEFAULT_CATEGORY_ID = "";
 
 class OformsFilter {
+  page: number;
+
+  pageSize: number;
+
+  categorizeBy: string;
+
+  categoryId: string;
+
+  locale: string;
+
+  search: string;
+
+  sortBy: string;
+
+  sortOrder: string;
+
+  total: number;
+
   constructor(
     page = DEFAULT_PAGE,
     pageSize = DEFAULT_PAGE_SIZE,
@@ -83,25 +101,25 @@ class OformsFilter {
     );
   }
 
-  static getFilter(location) {
+  static getFilter(location: Location) {
     if (!location) return this.getDefault();
 
-    const urlFilter = new URLSearchParams(location.search);
+    const urlFilter = getObjectByLocation(location);
+
     if (!urlFilter) return null;
 
     const defaultFilter = OformsFilter.getDefault();
+
     const page =
-      (urlFilter.get(PAGE) && +urlFilter.get(PAGE) - 1) || defaultFilter.page;
+      (urlFilter[PAGE] && +urlFilter[PAGE] - 1) || defaultFilter.page;
     const pageSize =
-      (urlFilter.get(PAGE_SIZE) && +urlFilter.get(PAGE_SIZE)) ||
-      defaultFilter.pageSize;
-    const categorizeBy =
-      urlFilter.get(CATEGORIZE_BY) || defaultFilter.categorizeBy;
-    const categoryId = urlFilter.get(CATEGORY_ID) || defaultFilter.categoryId;
-    const locale = urlFilter.get(LOCALE) || defaultFilter.locale;
-    const search = urlFilter.get(SEARCH) || defaultFilter.search;
-    const sortBy = urlFilter.get(SORT_BY) || defaultFilter.sortBy;
-    const sortOrder = urlFilter.get(SORT_ORDER) || defaultFilter.sortOrder;
+      (urlFilter[PAGE_SIZE] && +urlFilter[PAGE_SIZE]) || defaultFilter.pageSize;
+    const categorizeBy = urlFilter[CATEGORIZE_BY] || defaultFilter.categorizeBy;
+    const categoryId = urlFilter[CATEGORY_ID] || defaultFilter.categoryId;
+    const locale = urlFilter[LOCALE] || defaultFilter.locale;
+    const search = urlFilter[SEARCH] || defaultFilter.search;
+    const sortBy = urlFilter[SORT_BY] || defaultFilter.sortBy;
+    const sortOrder = urlFilter[SORT_ORDER] || defaultFilter.sortOrder;
 
     const newFilter = new OformsFilter(
       page,
@@ -133,10 +151,21 @@ class OformsFilter {
   }
 
   toUrlParams = () => {
-    const { categorizeBy, categoryId, locale, search, sortBy, sortOrder } =
-      this;
+    const {
+      page,
+      pageSize,
+      categorizeBy,
+      categoryId,
+      locale,
+      search,
+      sortBy,
+      sortOrder,
+    } = this;
 
-    const dtoFilter = {};
+    const dtoFilter: { [key: string]: unknown } = {};
+
+    dtoFilter[PAGE] = page;
+    dtoFilter[PAGE_SIZE] = pageSize;
     dtoFilter[CATEGORIZE_BY] = categorizeBy;
     dtoFilter[CATEGORY_ID] = categoryId;
     dtoFilter[LOCALE] = locale;
@@ -159,7 +188,8 @@ class OformsFilter {
       sortOrder,
     } = this;
 
-    const dtoFilter = {};
+    const dtoFilter: { [key: string]: unknown } = {};
+
     dtoFilter[PAGE] = page;
     dtoFilter[PAGE_SIZE] = pageSize;
     if (categorizeBy && categoryId)

packages/shared/api/oforms/index.ts

@@ -26,38 +26,61 @@
 
 import axios from "axios";
 
-export function getOforms(url) {
-  return axios.get(url);
-}
+import {
+  TOformsRequest,
+  TLocalesRequest,
+  TOformsCategoryRequest,
+} from "./types";
 
-export const getOformLocales = async (url) => {
+export const getOforms = async (url: string) => {
   const res = await axios.get(url);
-  return res?.data;
+  return res?.data as TOformsRequest;
 };
 
-export const getCategoryById = async (url, categorizeBy, id, locale) => {
+export const getOformsLocales = async (url: string) => {
+  const res = await axios.get(url);
+  return res?.data as TLocalesRequest;
+};
+
+export const getCategoryById = async (
+  url: string,
+  categorizeBy: string,
+  id: string,
+  locale: string,
+) => {
   const res = await axios.get(
     `${url}/${categorizeBy}/${id}?populate=*&locale=${locale}`,
   );
   return res?.data?.data;
 };
 
-export const getCategoryTypes = async (url, locale = "en") => {
+export const getCategoryTypes = async (url: string, locale = "en") => {
+  const res: TOformsCategoryRequest = await axios.get(
+    `${url}?populate=*&locale=${locale}`,
+  );
+  return res?.data?.data;
+};
+
+export const getCategoriesOfCategoryType = async (
+  url: string,
+  locale = "en",
+) => {
   const res = await axios.get(`${url}?populate=*&locale=${locale}`);
   return res?.data?.data;
 };
 
-export const getCategoriesOfCategoryType = async (url, locale = "en") => {
-  const res = await axios.get(`${url}?populate=*&locale=${locale}`);
-  return res?.data?.data;
-};
-
-export const getGuideLinkByLocale = async (url, locale = "en") => {
+export const getGuideLinkByLocale = async (url: string, locale = "en") => {
   const res = await axios.get(`${url}?locale=${locale}`);
   return res?.data?.data?.[0].attributes?.link;
 };
 
-export function submitToGallery(url, file, formName, language, signal) {
+export function submitToGallery(
+  url: string,
+  file,
+  formName: string,
+  language: string,
+  signal,
+) {
   const formData = new FormData();
   formData.append("file", file);
   formData.append("formName", formName);

packages/shared/api/oforms/types.ts

@@ -0,0 +1,126 @@
+// (c) Copyright Ascensio System SIA 2009-2024
+//
+// This program is a free software product.
+// You can redistribute it and/or modify it under the terms
+// of the GNU Affero General Public License (AGPL) version 3 as published by the Free Software
+// Foundation. In accordance with Section 7(a) of the GNU AGPL its Section 15 shall be amended
+// to the effect that Ascensio System SIA expressly excludes the warranty of non-infringement of
+// any third-party rights.
+//
+// This program is distributed WITHOUT ANY WARRANTY, without even the implied warranty
+// of MERCHANTABILITY or FITNESS FOR A PARTICULAR  PURPOSE. For details, see
+// the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
+//
+// You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021.
+//
+// The  interactive user interfaces in modified source and object code versions of the Program must
+// display Appropriate Legal Notices, as required under Section 5 of the GNU AGPL version 3.
+//
+// Pursuant to Section 7(b) of the License you must retain the original Product logo when
+// distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under
+// trademark law for use of our trademarks.
+//
+// All the Product's GUI elements, including illustrations and icon sets, as well as technical writing
+// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
+// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
+
+export type TBaseCategory = {
+  attributes: {
+    categoryId: string;
+    categoryTitle: string;
+    createdAt: string;
+    locale: string;
+    name: string;
+    publishedAt: string;
+    updatedAt: string;
+  };
+  id: number;
+};
+
+export type TOformsRequest = {
+  data?: TOformFile[];
+  meta: TRequestMetadata;
+};
+
+export type TLocalesRequest = TOformsLocale[];
+
+export type TOformsLocale = {
+  code: string;
+  createdAt: string;
+  id: number;
+  isDefault: boolean;
+  name: string;
+  updatedAt: string;
+};
+
+export type TOformsCategoryRequest = {
+  data: {
+    data?: TOformCategoryType[];
+    meta: TRequestMetadata;
+  };
+};
+
+export type TOformCategoryType = TBaseCategory & {
+  attributes: {
+    localizations?: TLocalizations;
+  };
+};
+
+export type TLocalizations = {
+  data: TBaseCategory[];
+};
+
+export type TOformFile = {
+  attributes: {
+    card_prewiew: {
+      data: {
+        attributes: {
+          url: string;
+        };
+        id: number;
+      };
+    };
+    description_card: string;
+    name_form: string;
+    template_desc: string;
+    template_image: {
+      data: {
+        attributes: {
+          formats: {
+            large?: TImageFormatData;
+            medium?: TImageFormatData;
+            small?: TImageFormatData;
+            sthumbnail?: TImageFormatData;
+            thumbnail?: TImageFormatData;
+            xsmall?: TImageFormatData;
+            xxsmall?: TImageFormatData;
+          };
+        };
+        id: number;
+      };
+    };
+    updatedAt: string;
+  };
+  id: number;
+};
+
+export type TImageFormatData = {
+  ext: string;
+  hash: string;
+  height: number;
+  mime: string;
+  name: string;
+  path: null;
+  size: number;
+  url: string;
+  width: number;
+};
+
+export type TRequestMetadata = {
+  pagination?: {
+    page: number;
+    pageCount: number;
+    pageSize: number;
+    total: number;
+  };
+};