Fix Views on People page (#2265)

* fetching viewId for url

* fixed option menu name input

* fix table import

* fix unnecessary rerenders

* people working

---------

Co-authored-by: bosiraphael <raphael.bosi@gmail.com>

front/src/modules/views/components/ViewBarEffect.tsx

@@ -1,3 +1,5 @@
+import { useEffect } from 'react';
+import { useSearchParams } from 'react-router-dom';
 import { useRecoilCallback } from 'recoil';
 
 import { ColumnDefinition } from '@/ui/data/data-table/types/ColumnDefinition';
@@ -35,9 +37,12 @@ export const ViewBarEffect = () => {
     setSavedViewFilters,
     currentViewId,
     setViews,
+    changeView,
     setCurrentViewId,
   } = useView();
 
+  const [searchParams] = useSearchParams();
+
   const { viewType, viewObjectId } = useViewInternalStates(viewScopeId);
 
   useGetViewFieldsQuery({
@@ -112,7 +117,7 @@ export const ViewBarEffect = () => {
 
       if (!nextViews.length) return;
 
-      if (!currentViewId) return setCurrentViewId(nextViews[0].id);
+      if (!currentViewId) return changeView(nextViews[0].id);
     }),
   });
 
@@ -214,5 +219,12 @@ export const ViewBarEffect = () => {
     }),
   });
 
+  const currentViewIdFromUrl = searchParams.get('view');
+
+  useEffect(() => {
+    if (!currentViewIdFromUrl) return;
+    setCurrentViewId(currentViewIdFromUrl);
+  }, [currentViewIdFromUrl, setCurrentViewId]);
+
   return <></>;
 };

front/src/modules/views/components/ViewsDropdownButton.tsx

@@ -67,15 +67,10 @@ export const ViewsDropdownButton = ({
   onViewEditModeChange,
 }: ViewsDropdownButtonProps) => {
   const theme = useTheme();
-  const { scopeId, removeView, currentViewId } = useView();
+  const { scopeId, removeView, currentViewId, changeView } = useView();
 
-  const {
-    views,
-    currentView,
-    setViewEditMode,
-    setCurrentViewId,
-    entityCountInCurrentView,
-  } = useViewInternalStates(scopeId, currentViewId);
+  const { views, currentView, setViewEditMode, entityCountInCurrentView } =
+    useViewInternalStates(scopeId, currentViewId);
 
   const {
     isDropdownOpen: isViewsDropdownOpen,
@@ -90,11 +85,11 @@ export const ViewsDropdownButton = ({
 
   const handleViewSelect = useRecoilCallback(
     () => async (viewId: string) => {
-      setCurrentViewId(viewId);
+      changeView(viewId);
 
       closeViewsDropdown();
     },
-    [setCurrentViewId, closeViewsDropdown],
+    [changeView, closeViewsDropdown],
   );
 
   const handleAddViewButtonClick = () => {
@@ -109,7 +104,7 @@ export const ViewsDropdownButton = ({
     viewId: string,
   ) => {
     event.stopPropagation();
-    setCurrentViewId(viewId);
+    changeView(viewId);
     setViewEditMode('edit');
     onViewEditModeChange?.();
     closeViewsDropdown();