release-v-1-15-0 (#32)

* Version update

* Creating LF allows spaces and special characters

* Margin missing in the crowd labeler init view (edit description outline overlap)

* Zero shot: blue border doesn’t pass when all buttons have indigo color

* Submodule update

* View as export tooltip centered with margin should be without

* run on 10 isn’t disabled on run

* Model Downlaod page → OpenAI models cannot be downloaded and should be excluded from the selection list

* Users page: two scrollbars

* Submodule changes

* record coments icon/modal isn’t displayed

* Disabled issued on lf run on 10

* ref

---------

Co-authored-by: Lina <[email protected]>
Co-authored-by: JWittmeyer <[email protected]>

Author: 3 people

src/components/models-download/AddModelDownloadModal.tsx

@@ -11,6 +11,7 @@ import { ModelsDownloaded, ModelsDownloadedStatus } from "@/src/types/components
 import { CacheEnum, selectCachedValue } from "@/src/reduxStore/states/cachedValues";
 import Dropdown2 from "@/submodules/react-components/components/Dropdown2";
 import { modelProviderDownloadModel } from "@/src/services/base/misc";
+import { PlatformType } from "@/src/types/components/projects/projectId/settings/embeddings";
 
 const ACCEPT_BUTTON = { buttonCaption: 'Accept', useButton: true };
 
@@ -29,7 +30,7 @@ export default function AddModelDownloadModal() {
 
     useEffect(() => {
         if (!modelsList) return;
-        setFilteredList(modelsList);
+        setFilteredList(modelsList.filter((model: any) => model.platform !== PlatformType.OPEN_AI));
     }, [modelsList]);
 
     useEffect(() => {

src/components/models-download/ModelsDownload.tsx

@@ -8,7 +8,7 @@ import { useDispatch, useSelector } from "react-redux";
 import LoadingIcon from "../shared/loading/LoadingIcon";
 import { openModal, setModalStates } from "@/src/reduxStore/states/modal";
 import { ModalEnum } from "@/src/types/shared/modal";
-import { selectIsAdmin, selectIsManaged } from "@/src/reduxStore/states/general";
+import { selectIsAdmin, selectIsManaged, selectOrganizationId } from "@/src/reduxStore/states/general";
 import { timer } from "rxjs";
 import { TOOLTIPS_DICT } from "@/src/util/tooltip-constants";
 import AddModelDownloadModal from "./AddModelDownloadModal";
@@ -44,7 +44,8 @@ export default function ModelsDownload() {
         }
     }, []);
 
-    useWebsocket(Application.REFINERY, CurrentPage.MODELS_DOWNLOAD, handleWebsocketNotification);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.MODELS_DOWNLOAD, handleWebsocketNotification);
 
     return (<div className="p-4 bg-gray-100 flex-1 flex flex-col h-[calc(100vh-4rem)] overflow-y-auto">
         <div className="flex flex-row items-center">

src/components/projects/ButtonsContainer.tsx

@@ -1,4 +1,4 @@
-import { selectUser } from "@/src/reduxStore/states/general"
+import { selectOrganizationId, selectUser } from "@/src/reduxStore/states/general"
 import { openModal } from "@/src/reduxStore/states/modal";
 import { setUploadFileType } from "@/src/reduxStore/states/upload";
 import { ModalEnum } from "@/src/types/shared/modal";
@@ -33,7 +33,8 @@ export default function ButtonsContainer() {
         }
     }, []);
 
-    useWebsocket(Application.REFINERY, CurrentPage.PROJECTS, handleWebsocketNotification, null, CurrentPageSubKey.BUTTONS_CONTAINER);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.PROJECTS, handleWebsocketNotification, null, CurrentPageSubKey.BUTTONS_CONTAINER);
 
     return (
         user && user.role === UserRole.ENGINEER ? (<div>

src/components/projects/ProjectsList.tsx

@@ -1,4 +1,4 @@
-import { selectInactiveOrganization, selectIsDemo, selectIsManaged, selectUser, setComments } from "@/src/reduxStore/states/general"
+import { selectInactiveOrganization, selectIsDemo, selectIsManaged, selectOrganizationId, selectUser, setComments } from "@/src/reduxStore/states/general"
 import { selectAllProjects, setAllProjects } from "@/src/reduxStore/states/project";
 import { Project, ProjectStatistics } from "@/src/types/components/projects/projects-list";
 import { percentRoundString } from "@/submodules/javascript-functions/general";
@@ -101,7 +101,8 @@ export default function ProjectsList() {
         }
     }, []);
 
-    useWebsocket(Application.REFINERY, CurrentPage.PROJECTS, handleWebsocketNotification);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.PROJECTS, handleWebsocketNotification);
 
     return (
         <div>

src/components/projects/projectId/admin/ProjectAdmin.tsx

@@ -11,7 +11,7 @@ import { useDispatch, useSelector } from "react-redux";
 import NewPersonalToken from "./NewPersonalTokenModal";
 import DeletePersonalToken from "./DeletePersonalTokenModal";
 import { useRouter } from "next/router";
-import { selectIsAdmin } from "@/src/reduxStore/states/general";
+import { selectIsAdmin, selectOrganizationId } from "@/src/reduxStore/states/general";
 import { useWebsocket } from "@/submodules/react-components/hooks/web-socket/useWebsocket";
 import { getAccessTokens } from "@/src/services/base/project";
 import { Application, CurrentPage } from "@/submodules/react-components/hooks/web-socket/constants";
@@ -53,7 +53,9 @@ export default function ProjectAdmin() {
         }
     }, [accessTokens]);
 
-    useWebsocket(Application.REFINERY, CurrentPage.ADMIN_PAGE, handleWebsocketNotification, projectId);
+
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.ADMIN_PAGE, handleWebsocketNotification, projectId);
 
     return (<>
         {accessTokens && <div className="p-4 bg-gray-100 h-full overflow-y-auto flex-1 flex flex-col">

src/components/projects/projectId/attributes/attributeId/AttributeCalculations.tsx

@@ -21,7 +21,7 @@ import ContainerLogs from "@/src/components/shared/logs/ContainerLogs";
 import LoadingIcon from "@/src/components/shared/loading/LoadingIcon";
 import { debounceTime, distinctUntilChanged, fromEvent, timer } from "rxjs";
 import { TOOLTIPS_DICT } from "@/src/util/tooltip-constants";
-import { selectAllUsers, setComments } from "@/src/reduxStore/states/general";
+import { selectAllUsers, selectOrganizationId, setComments } from "@/src/reduxStore/states/general";
 import { CommentDataManager } from "@/src/util/classes/comments";
 import { CommentType } from "@/src/types/shared/comments";
 import BricksIntegrator from "@/src/components/shared/bricks-integrator/BricksIntegrator";
@@ -285,7 +285,8 @@ export default function AttributeCalculation() {
         }
     }, [projectId, currentAttribute]);
 
-    useWebsocket(Application.REFINERY, CurrentPage.ATTRIBUTE_CALCULATION, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.ATTRIBUTE_CALCULATION, handleWebsocketNotification, projectId);
 
     return (projectId && <div className={`bg-white p-4 overflow-y-auto min-h-full h-[calc(100vh-4rem)]`} onScroll={(e: any) => onScrollEvent(e)}>
         {currentAttribute && <div>

src/components/projects/projectId/attributes/attributeId/ExecutionContainer.tsx

@@ -75,7 +75,7 @@ export default function ExecutionContainer(props: ExecutionContainerProps) {
                 <Tooltip content={TOOLTIPS_DICT.ATTRIBUTE_CALCULATION.EXECUTE_10_RECORDS} color="invert" placement="bottom" className="ml-auto">
                     <button onClick={calculateUserAttributeSampleRecords}
                         disabled={props.currentAttribute.state == AttributeState.USABLE || props.currentAttribute.state == AttributeState.RUNNING || requestedSomething || props.tokenizationProgress < 1 || props.checkUnsavedChanges}
-                        className={`bg-white text-gray-700 text-xs font-semibold px-4 py-2 rounded-md border border-gray-300 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed`}>
+                        className={`bg-white text-gray-700 text-xs font-semibold px-4 py-2 rounded-md border border-gray-300 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed`}>
                         Run on 10
                     </button>
                 </Tooltip>

src/components/projects/projectId/data-browser/DataBrowser.tsx

@@ -6,7 +6,7 @@ import { expandRecordList, selectActiveSearchParams, selectActiveSlice, selectCo
 import { postProcessRecordsExtended, postProcessUniqueValues, postProcessUsersCount } from "@/src/util/components/projects/projectId/data-browser/data-browser-helper";
 import { selectAttributes, selectLabelingTasksAll, setAllAttributes, setAllEmbeddings, setLabelingTasksAll } from "@/src/reduxStore/states/pages/settings";
 import { postProcessLabelingTasks, postProcessLabelingTasksSchema } from "@/src/util/components/projects/projectId/settings/labeling-tasks-helper";
-import { selectAllUsers, selectUser, setComments } from "@/src/reduxStore/states/general";
+import { selectAllUsers, selectOrganizationId, selectUser, setComments } from "@/src/reduxStore/states/general";
 import DataBrowserRecords from "./DataBrowserRecords";
 import { postProcessingEmbeddings } from "@/src/util/components/projects/projectId/settings/embeddings-helper";
 import { CommentType } from "@/src/types/shared/comments";
@@ -141,7 +141,7 @@ export default function DataBrowser() {
         const currentRecordIds = parsedRecordData?.map((record) => record.id);
         if (!currentRecordIds || currentRecordIds.length == 0) return;
         getRecordComments(projectId, currentRecordIds, (res) => {
-            dispatch(setRecordComments(res.data['recordComments']));
+            dispatch(setRecordComments(res.data['getRecordComments']));
         });
     }
 
@@ -175,7 +175,8 @@ export default function DataBrowser() {
         }
     }, [projectId]);
 
-    useWebsocket(Application.REFINERY, CurrentPage.DATA_BROWSER, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.DATA_BROWSER, handleWebsocketNotification, projectId);
 
     return (<>
         {projectId && <div className="flex flex-row h-full">

src/components/projects/projectId/data-browser/modals/DataSliceInfoModal.tsx

@@ -39,9 +39,9 @@ export default function DataSliceInfoModal() {
                                 {value.substring(value.startsWith("https") ? 8 : 7)}</span>
                         </Tooltip>
                     </div>
-                    <Tooltip content={TOOLTIPS_DICT.DATA_BROWSER.ONLY_MANAGED} color="invert" placement="right">
+                    <Tooltip content={TOOLTIPS_DICT.DATA_BROWSER.ONLY_MANAGED} color="invert" placement="right" className="mt-3">
                         <button onClick={() => testLink(value + '?pos=1&type=DATA_SLICE')} disabled={!isManaged}
-                            className="mt-3 opacity-100 w-40 bg-indigo-700 text-white text-xs leading-4 font-semibold px-4 py-2 rounded-md cursor-pointer hover:bg-indigo-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed">
+                            className="opacity-100 w-40 bg-indigo-700 text-white text-xs leading-4 font-semibold px-4 py-2 rounded-md cursor-pointer hover:bg-indigo-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed">
                             View as expert
                         </button>
                     </Tooltip>

src/components/projects/projectId/edit-records/EditRecords.tsx

@@ -16,6 +16,7 @@ import { openModal } from "@/src/reduxStore/states/modal";
 import { useWebsocket } from "@/submodules/react-components/hooks/web-socket/useWebsocket";
 import { scrollElementIntoView } from "@/submodules/javascript-functions/scrollHelper";
 import { Application, CurrentPage } from "@/submodules/react-components/hooks/web-socket/constants";
+import { selectOrganizationId } from "@/src/reduxStore/states/general";
 
 export default function EditRecords() {
     const dispatch = useDispatch();
@@ -72,7 +73,8 @@ export default function EditRecords() {
         setAlertLastVisible(Date.now());
     }, [alertLastVisible]);
 
-    useWebsocket(Application.REFINERY, CurrentPage.EDIT_RECORDS, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.EDIT_RECORDS, handleWebsocketNotification, projectId);
 
     return (<>{projectId && <div className="bg-white flex flex-col min-h-full h-[calc(100vh-4rem)]">
         <NavBarTopEditRecords erdData={erdData} setErdData={(erdData) => setErdData(erdData)} />

src/components/projects/projectId/heuristics/HeuristicsHeader.tsx

@@ -1,5 +1,5 @@
 import { Loading } from "@nextui-org/react";
-import { selectIsManaged } from '@/src/reduxStore/states/general';
+import { selectIsManaged, selectOrganizationId } from '@/src/reduxStore/states/general';
 import { openModal, selectModal } from '@/src/reduxStore/states/modal';
 import { selectHeuristicsAll, setHeuristicType } from '@/src/reduxStore/states/pages/heuristics';
 import { selectLabelingTasksAll } from '@/src/reduxStore/states/pages/settings';
@@ -155,7 +155,8 @@ export default function HeuristicsHeader(props: HeuristicsHeaderProps) {
         else if (msgParts[1] == 'weak_supervision_finished') setLoadingIconWS(false);
     }, []);
 
-    useWebsocket(Application.REFINERY, CurrentPage.HEURISTICS, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.HEURISTICS, handleWebsocketNotification, projectId);
 
     return (
         <div className="flex-shrink-0 block xl:flex justify-between items-center">

src/components/projects/projectId/heuristics/HeuristicsOverview.tsx

@@ -16,7 +16,7 @@ import AddCrowdLabelerModal from "./modals/AddCrowdLabelerModal";
 import { postProcessingEmbeddings } from "@/src/util/components/projects/projectId/settings/embeddings-helper";
 import { CommentType } from "@/src/types/shared/comments";
 import { CommentDataManager } from "@/src/util/classes/comments";
-import { selectAllUsers, setBricksIntegrator, setComments } from "@/src/reduxStore/states/general";
+import { selectAllUsers, selectOrganizationId, setBricksIntegrator, setComments } from "@/src/reduxStore/states/general";
 import { getEmptyBricksIntegratorConfig } from "@/src/util/shared/bricks-integrator-helper";
 import { useWebsocket } from "@/submodules/react-components/hooks/web-socket/useWebsocket";
 import { getAllComments } from "@/src/services/base/comment";
@@ -106,7 +106,8 @@ export function HeuristicsOverview() {
         }
     }, [projectId]);
 
-    useWebsocket(Application.REFINERY, CurrentPage.HEURISTICS, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.HEURISTICS, handleWebsocketNotification, projectId);
 
     return (projectId && <div className="p-4 bg-gray-100 h-full flex-1 flex flex-col">
         <div className="w-full h-full -mr-4">

src/components/projects/projectId/heuristics/heuristicId/active-learning/ActiveLearning.tsx

@@ -21,7 +21,7 @@ import HeuristicStatistics from "../shared/HeuristicStatistics";
 import DangerZone from "@/src/components/shared/danger-zone/DangerZone";
 import { DangerZoneEnum } from "@/src/types/shared/danger-zone";
 import { getPythonClassName, getPythonClassRegExMatch } from "@/submodules/javascript-functions/python-functions-parser";
-import { selectAllUsers, setBricksIntegrator, setLabelsBricksIntegrator, setComments } from "@/src/reduxStore/states/general";
+import { selectAllUsers, setBricksIntegrator, setLabelsBricksIntegrator, setComments, selectOrganizationId } from "@/src/reduxStore/states/general";
 import { CommentType } from "@/src/types/shared/comments";
 import { CommentDataManager } from "@/src/util/classes/comments";
 import BricksIntegrator from "@/src/components/shared/bricks-integrator/BricksIntegrator";
@@ -204,7 +204,8 @@ export default function ActiveLearning() {
         });
     }
 
-    useWebsocket(Application.REFINERY, CurrentPage.ACTIVE_LEARNING, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.ACTIVE_LEARNING, handleWebsocketNotification, projectId);
 
     return (
         <HeuristicsLayout updateSourceCode={(code) => updateSourceCodeToDisplay(code)}>

src/components/projects/projectId/heuristics/heuristicId/crowd-labeler/CrowdLabeler.tsx

@@ -6,7 +6,7 @@ import { useRouter } from "next/router";
 import { useCallback, useEffect } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import HeuristicsLayout from "../shared/HeuristicsLayout";
-import { selectAllUsers, selectAnnotators, setComments } from "@/src/reduxStore/states/general";
+import { selectAllUsers, selectAnnotators, selectOrganizationId, setComments } from "@/src/reduxStore/states/general";
 import DangerZone from "@/src/components/shared/danger-zone/DangerZone";
 import { DangerZoneEnum } from "@/src/types/shared/danger-zone";
 import HeuristicStatistics from "../shared/HeuristicStatistics";
@@ -113,15 +113,16 @@ export default function CrowdLabeler() {
         }
     }, [currentHeuristic, projectId]);
 
-    useWebsocket(Application.REFINERY, CurrentPage.CROWD_LABELER, handleWebsocketNotification, projectId);
+    const orgId = useSelector(selectOrganizationId);
+    useWebsocket(orgId, Application.REFINERY, CurrentPage.CROWD_LABELER, handleWebsocketNotification, projectId);
 
     return (<HeuristicsLayout>
         {currentHeuristic && <div>
             {annotators.length == 0 || dataSlices.length == 0 ? (
                 <>
                     <div className="overflow-hidden bg-white">
                         <div className="relative py-8 pr-4">
-                            <div className="absolute top-0 bottom-0 left-3/4 hidden w-screen bg-gray-50 lg:block"></div>
+                            <div className="absolute top-2 bottom-0 left-3/4 hidden w-screen bg-gray-50 lg:block"></div>
                             <div className="mx-auto max-w-prose text-base lg:grid lg:max-w-none lg:grid-cols-2 lg:gap-8">
                                 <div>
                                     <h2 className="text-lg font-semibold text-indigo-600">Integrating crowd labelers</h2>