feat(project): deploy and project adjustments (MIN-304)

src/redux/overlays/overlays.thunks.ts

@@ -14,6 +14,7 @@ import { PluginsEventBus } from '@/services/pluginsManager/pluginsEventBus';
 import { showToast } from '@/utils/showToast';
 import { getErrorMessage } from '@/utils/getErrorMessage';
 import { ThunkConfig } from '@/types/store';
+import { BASE_API_URL } from '@/constants';
 import { apiPath } from '../apiPath';
 import {
   CHUNK_SIZE,
@@ -124,7 +125,7 @@ const uploadContent = async ({ createdFile, overlayContent }: UploadContentArgs)
     const chunk = data.slice(uploadedLength, uploadedLength + CHUNK_SIZE);
 
     const responeJSON = await fetch(
-      `${process.env.NEXT_PUBLIC_BASE_API_URL}/${apiPath.uploadOverlayFileContent(createdFile.id)}`,
+      `${BASE_API_URL}/${apiPath.uploadOverlayFileContent(createdFile.id)}`,
       {
         method: 'POST',
         credentials: 'include',

src/redux/project/project.mock.ts

@@ -6,9 +6,10 @@ export const PROJECT_STATE_INITIAL_MOCK: ProjectState = {
   data: undefined,
   loading: 'idle',
   error: DEFAULT_ERROR,
+  projectId: '',
 };
 
-export const PROJECT_OVERVIEW_IMAGE_MOCK: OverviewImageView = {
+export const PROJECT_OVERVIEW_IMAGE_MOCK: NonNullable<OverviewImageView> = {
   idObject: 440,
   filename: '9d4911bdeeea752f076e57a91d9b1f45/biolayout_main_root.png',
   width: 5776,

src/redux/project/project.reducers.test.ts

@@ -17,6 +17,7 @@ const INITIAL_STATE: ProjectState = {
   data: undefined,
   loading: 'idle',
   error: { name: '', message: '' },
+  projectId: '',
 };
 
 describe('project reducer', () => {

src/redux/project/project.reducers.ts

-import { getProjectById } from '@/redux/project/project.thunks';
+import { getProjectById, setProjectId } from '@/redux/project/project.thunks';
 import { ProjectState } from '@/redux/project/project.types';
 import { ActionReducerMapBuilder } from '@reduxjs/toolkit';
 
@@ -15,3 +15,9 @@ export const getProjectByIdReducer = (builder: ActionReducerMapBuilder<ProjectSt
     // TODO to discuss manage state of failure
   });
 };
+
+export const setProjectIdReducer = (builder: ActionReducerMapBuilder<ProjectState>): void => {
+  builder.addCase(setProjectId.fulfilled, (state, action) => {
+    state.projectId = action.payload;
+  });
+};

src/redux/project/project.selectors.ts

@@ -10,7 +10,7 @@ export const projectDataSelector = createSelector(projectSelector, project => pr
 
 export const projectDefaultOverviewImageIdSelector = createSelector(
   projectDataSelector,
-  projectData => projectData?.topOverviewImage.idObject || OVERVIEW_IMAGE_ID_DEFAULT,
+  projectData => projectData?.topOverviewImage?.idObject || OVERVIEW_IMAGE_ID_DEFAULT,
 );
 
 export const currentOverviewImageSelector = createSelector(
@@ -63,3 +63,5 @@ export const organismNameSelector = createSelector(
 );
 
 export const versionSelector = createSelector(projectDataSelector, state => state?.version);
+
+export const projectMainIdSelector = createSelector(projectSelector, project => project.projectId);

src/redux/project/project.slice.ts

 import { ProjectState } from '@/redux/project/project.types';
 import { createSlice } from '@reduxjs/toolkit';
-import { getProjectByIdReducer } from './project.reducers';
+import { getProjectByIdReducer, setProjectIdReducer } from './project.reducers';
 
 const initialState: ProjectState = {
   data: undefined,
   loading: 'idle',
   error: { name: '', message: '' },
+  projectId: '',
 };
 
 const projectSlice = createSlice({
@@ -14,6 +15,7 @@ const projectSlice = createSlice({
   reducers: {},
   extraReducers: builder => {
     getProjectByIdReducer(builder);
+    setProjectIdReducer(builder);
   },
 });
 

src/redux/project/project.thunks.ts

@@ -5,8 +5,10 @@ import { validateDataUsingZodSchema } from '@/utils/validateDataUsingZodSchema';
 import { createAsyncThunk } from '@reduxjs/toolkit';
 import { getErrorMessage } from '@/utils/getErrorMessage';
 import { ThunkConfig } from '@/types/store';
+import { DEFAULT_PROJECT_ID } from '@/constants';
 import { apiPath } from '../apiPath';
 import { PROJECT_FETCHING_ERROR_PREFIX } from './project.constants';
+import { SetProjectIdParams } from './project.types';
 
 export const getProjectById = createAsyncThunk<Project | undefined, string, ThunkConfig>(
   'project/getProjectById',
@@ -23,3 +25,12 @@ export const getProjectById = createAsyncThunk<Project | undefined, string, Thun
     }
   },
 );
+
+export const setProjectId = createAsyncThunk<string, SetProjectIdParams, ThunkConfig>(
+  'project/setProjectId',
+  async ({ queryData }) => {
+    const projectId = queryData?.id || DEFAULT_PROJECT_ID;
+
+    return projectId;
+  },
+);

src/redux/project/project.types.ts

 import { Loading } from '@/types/loadingState';
 import { Project } from '@/types/models';
+import { QueryData } from '@/types/query';
 
 export type ProjectState = {
+  projectId: string;
   data: Project | undefined;
   loading: Loading;
   error: Error;
 };
+
+export type SetProjectIdParams = { queryData: QueryData };

src/redux/root/init.thunks.ts

@@ -20,7 +20,7 @@ import {
   getAllUserOverlaysByCreator,
 } from '../overlays/overlays.thunks';
 import { getAllPlugins, getInitPlugins } from '../plugins/plugins.thunks';
-import { getProjectById } from '../project/project.thunks';
+import { getProjectById, setProjectId } from '../project/project.thunks';
 import { setPerfectMatch } from '../search/search.slice';
 import { getSearchData } from '../search/search.thunks';
 import { getStatisticsById } from '../statistics/statistics.thunks';
@@ -35,6 +35,8 @@ export const fetchInitialAppData = createAsyncThunk<
   InitializeAppParams,
   { dispatch: AppDispatch }
 >('appInit/fetchInitialAppData', async ({ queryData }, { dispatch }): Promise<void> => {
+  dispatch(setProjectId({ queryData }));
+
   if (queryData.pluginsId) {
     await dispatch(
       getInitPlugins({

src/redux/root/query.selectors.ts

@@ -5,6 +5,7 @@ import { mapDataSelector } from '../map/map.selectors';
 import { perfectMatchSelector, searchValueSelector } from '../search/search.selectors';
 import { activeOverlaysIdSelector } from '../overlayBioEntity/overlayBioEntity.selector';
 import { activePluginsIdSelector } from '../plugins/plugins.selectors';
+import { projectMainIdSelector } from '../project/project.selectors';
 
 export const queryDataParamsSelector = createSelector(
   searchValueSelector,
@@ -12,12 +13,14 @@ export const queryDataParamsSelector = createSelector(
   mapDataSelector,
   activeOverlaysIdSelector,
   activePluginsIdSelector,
+  projectMainIdSelector,
   (
     searchValue,
     perfectMatch,
     { modelId, backgroundId, position },
     activeOverlaysId,
     activePluginsId,
+    id,
   ): QueryDataParams => {
     const joinedSearchValue = searchValue.join(';');
     const shouldIncludeSearchValue = searchValue.length > ZERO && joinedSearchValue;
@@ -26,6 +29,7 @@ export const queryDataParamsSelector = createSelector(
     const shouldIncludePluginsId = activePluginsId.length > ZERO;
 
     const queryDataParams: QueryDataParams = {
+      id,
       perfectMatch,
       modelId,
       backgroundId,

src/types/query.ts

 import { Point } from './map';
 
 export interface QueryData {
+  id?: string;
   searchValue?: string[];
   perfectMatch: boolean;
   modelId?: number;
@@ -11,6 +12,7 @@ export interface QueryData {
 }
 
 export interface QueryDataParams {
+  id?: string;
   searchValue?: string;
   perfectMatch: boolean;
   modelId?: number;
@@ -23,6 +25,7 @@ export interface QueryDataParams {
 }
 
 export interface QueryDataRouterParams {
+  id?: string;
   searchValue?: string;
   perfectMatch?: string;
   modelId?: string;

src/utils/parseQueryToTypes.ts

 import { QueryData, QueryDataRouterParams } from '@/types/query';
 
 export const parseQueryToTypes = (query: QueryDataRouterParams): QueryData => ({
+  id: query.id,
   searchValue: query.searchValue?.split(';'),
   perfectMatch: query?.perfectMatch === 'true' || false,
   modelId: Number(query.modelId) || undefined,

src/utils/query-manager/useReduxBusQueryManager.test.ts

@@ -48,6 +48,7 @@ describe('useReduxBusQueryManager - util', () => {
       project: {
         ...loadedDataMock,
         data: undefined,
+        projectId: '',
       },
       map: {
         ...loadedDataMock,