Merge branch 'develop' into fix-open-close-folders

frontend/src/js/app/Content.tsx

@@ -58,7 +58,7 @@ const Content = () => {
           >
             {displayTooltip ? <Tooltip /> : <ActivateTooltip />}
           </Panel>
-          <ResizeHandle />
+          <ResizeHandle disabled={!displayTooltip} />
           <Panel minSize={350} defaultSize={600}>
             <LeftPane />
           </Panel>

frontend/src/js/common/ResizeHandle.tsx

@@ -34,9 +34,15 @@ const Line = styled("div")`
   background-color: ${({ theme }) => theme.col.grayMediumLight};
 `;
 
-export const ResizeHandle = ({ style }: { style?: CSSProperties }) => {
+export const ResizeHandle = ({
+  style,
+  disabled,
+}: {
+  style?: CSSProperties;
+  disabled?: boolean;
+}) => {
   return (
-    <SxPanelResizeHandle style={style}>
+    <SxPanelResizeHandle style={style} disabled={disabled}>
       <Handle>
         <Line />
       </Handle>

frontend/src/js/external-forms/form-concept-group/FormConceptGroup.tsx

@@ -127,6 +127,10 @@ const FormConceptGroup = (props: Props) => {
     allowlistedTables: props.allowlistedTables,
     blocklistedTables: props.blocklistedTables,
   };
+  const selectConfig = {
+    allowlistedSelects: props.allowlistedSelects,
+    blocklistedSelects: props.blocklistedSelects,
+  };
 
   // indicator if it should be scrolled down back to the dropZone
   const [scrollToDropzone, setScrollToDropzone] = useState<boolean>(false);
@@ -163,6 +167,7 @@ const FormConceptGroup = (props: Props) => {
     onChange: props.onChange,
     defaults,
     tableConfig,
+    selectConfig,
     isValidConcept: props.isValidConcept,
   });
 
@@ -216,7 +221,7 @@ const FormConceptGroup = (props: Props) => {
 
             const concept = isMovedObject(item)
               ? copyConcept(item)
-              : initializeConcept(item, defaults, tableConfig);
+              : initializeConcept(item, defaults, tableConfig, selectConfig);
 
             let insertIndex = i;
             let newPropsValue = props.value;
@@ -301,7 +306,7 @@ const FormConceptGroup = (props: Props) => {
 
           const concept = isMovedObject(item)
             ? copyConcept(item)
-            : initializeConcept(item, defaults, tableConfig);
+            : initializeConcept(item, defaults, tableConfig, selectConfig);
           return props.onChange(
             addConcept(
               addValue(props.value, newValue),
@@ -435,7 +440,12 @@ const FormConceptGroup = (props: Props) => {
                           props.value,
                           i,
                           j,
-                          initializeConcept(item, defaults, tableConfig),
+                          initializeConcept(
+                            item,
+                            defaults,
+                            tableConfig,
+                            selectConfig,
+                          ),
                         ),
                       );
                     }}

frontend/src/js/external-forms/form-concept-group/formConceptGroupState.ts

@@ -12,7 +12,7 @@ import {
 import { TreesT } from "../../concept-trees/reducer";
 import { mergeFilterOptions } from "../../model/filter";
 import { NodeResetConfig } from "../../model/node";
-import { resetSelects } from "../../model/select";
+import { SelectConfig, resetSelects } from "../../model/select";
 import { resetTables, tableWithDefaults } from "../../model/table";
 import { filterSuggestionToSelectOption } from "../../query-node-editor/suggestionsHelper";
 import type {
@@ -278,6 +278,7 @@ export const addConceptsFromFile = (
   resolvedConcepts: string[],
 
   tableConfig: TableConfig,
+  selectConfig: SelectConfig,
   defaults: ConceptListDefaultsType,
   isValidConcept: ((item: FormConceptNodeT) => boolean) | undefined,
 
@@ -301,7 +302,12 @@ export const addConceptsFromFile = (
 
   if (!queryElement) return value;
 
-  const concept = initializeConcept(queryElement, defaults, tableConfig);
+  const concept = initializeConcept(
+    queryElement,
+    defaults,
+    tableConfig,
+    selectConfig,
+  );
 
   if (!concept || (!!isValidConcept && !isValidConcept(concept))) return value;
 
@@ -325,6 +331,7 @@ export const initializeConcept = (
   item: FormConceptNodeT,
   defaults: ConceptListDefaultsType,
   tableConfig: TableConfig,
+  selectConfig: SelectConfig,
 ) => {
   if (!item) return item;
 
@@ -336,8 +343,8 @@ export const initializeConcept = (
     ...item,
     excludeFromSecondaryId: false,
     excludeTimestamps: false,
-    tables: resetTables(item.tables, { useDefaults: true }),
-    selects: resetSelects(item.selects, { useDefaults: true }),
+    tables: resetTables(item.tables, { useDefaults: true, selectConfig }),
+    selects: resetSelects(item.selects, { useDefaults: true, selectConfig }),
   });
 };
 

frontend/src/js/external-forms/form-concept-group/useUploadConceptListModal.ts

@@ -13,6 +13,7 @@ import {
 } from "../../upload-concept-list-modal/actions";
 import type { ConceptListDefaults as ConceptListDefaultsType } from "../config-types";
 
+import { SelectConfig } from "../../model/select";
 import {
   addConceptsFromFile,
   FormConceptGroupT,
@@ -30,13 +31,15 @@ export const useUploadConceptListModal = ({
   newValue,
   defaults,
   tableConfig,
+  selectConfig,
   isValidConcept,
 }: {
   value: FormConceptGroupT[];
   onChange: (value: FormConceptGroupT[]) => void;
   newValue: FormConceptGroupT;
   defaults: ConceptListDefaultsType;
   tableConfig: TableConfig;
+  selectConfig: SelectConfig;
   isValidConcept?: (concept: DragItemConceptTreeNode) => boolean;
 }) => {
   const { t } = useTranslation();
@@ -108,6 +111,7 @@ export const useUploadConceptListModal = ({
         resolvedConcepts,
 
         tableConfig,
+        selectConfig,
         defaults,
         isValidConcept,
 

frontend/src/js/external-forms/form-configs/selectors.ts

@@ -2,6 +2,13 @@ import { exists } from "../../common/helpers/exists";
 import type { ProjectItemsFilterStateT } from "../../previous-queries/filter/reducer";
 import { FormConfigT } from "../../previous-queries/list/reducer";
 
+const configHasOwner = (config: FormConfigT, searchTerm: string) => {
+  return (
+    !!config.ownerName &&
+    config.ownerName.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1
+  );
+};
+
 const configHasTag = (config: FormConfigT, searchTerm: string) => {
   return (
     !!config.tags &&
@@ -58,7 +65,8 @@ export const configMatchesSearch = (
   !exists(searchTerm) ||
   configHasId(config, searchTerm) ||
   configHasLabel(config, searchTerm) ||
-  configHasTag(config, searchTerm);
+  configHasTag(config, searchTerm) ||
+  configHasOwner(config, searchTerm);
 
 export const selectFormConfigs = (
   formConfigs: FormConfigT[],

frontend/src/js/model/node.ts

@@ -19,7 +19,7 @@ import type {
 } from "../standard-query-editor/types";
 import { PossibleDroppableObject } from "../ui-components/Dropzone";
 
-import { objectHasNonDefaultSelects } from "./select";
+import { SelectConfig, objectHasNonDefaultSelects } from "./select";
 import {
   tablesHaveEmptySettings,
   tablesHaveFilterValues,
@@ -28,6 +28,7 @@ import {
 
 export interface NodeResetConfig {
   useDefaults?: boolean;
+  selectConfig?: SelectConfig;
 }
 
 export const nodeIsConceptQueryNode = (

frontend/src/js/model/select.ts

@@ -27,17 +27,6 @@ export function sortSelects(selects: SelectorT[]) {
     .sort((a, b) => (a.label < b.label ? -1 : 1));
 }
 
-const resetSelected = (select: SelectorT, config: NodeResetConfig) => ({
-  ...select,
-  selected: config.useDefaults ? !!select.default : false,
-});
-
-export const resetSelects = (
-  selects: SelectorT[],
-  config: NodeResetConfig = {},
-): SelectedSelectorT[] =>
-  selects.map((select) => resetSelected(select, config));
-
 function selectTypesMatch(
   resultType1: SelectorResultType,
   resultType2: SelectorResultType,
@@ -63,20 +52,37 @@ export function selectIsWithinTypes(
   );
 }
 
-interface AllowBlocklistedSelects {
+export interface SelectConfig {
   blocklistedSelects?: SelectorResultType[];
   allowlistedSelects?: SelectorResultType[];
 }
 
 export const isSelectDisabled = (
   select: SelectorT,
-  { blocklistedSelects, allowlistedSelects }: AllowBlocklistedSelects,
+  { blocklistedSelects, allowlistedSelects }: SelectConfig,
 ) =>
   (!!allowlistedSelects && !selectIsWithinTypes(select, allowlistedSelects)) ||
   (!!blocklistedSelects && selectIsWithinTypes(select, blocklistedSelects));
 
 export const isValidSelect =
-  ({ blocklistedSelects, allowlistedSelects }: AllowBlocklistedSelects) =>
+  ({ blocklistedSelects, allowlistedSelects }: SelectConfig) =>
   (select: SelectedSelectorT) =>
     !!select.selected &&
     !isSelectDisabled(select, { blocklistedSelects, allowlistedSelects });
+
+const resetSelected = (select: SelectorT, config: NodeResetConfig) => {
+  if (config.selectConfig && !isValidSelect(config.selectConfig)(select)) {
+    return { ...select, selected: false };
+  }
+
+  return {
+    ...select,
+    selected: config.useDefaults ? !!select.default : false,
+  };
+};
+
+export const resetSelects = (
+  selects: SelectorT[],
+  config: NodeResetConfig = {},
+): SelectedSelectorT[] =>
+  selects.map((select) => resetSelected(select, config));

frontend/src/js/previous-queries/list/ProjectItem.tsx

@@ -26,6 +26,7 @@ import FormSymbol from "../../symbols/FormSymbol";
 import QuerySymbol from "../../symbols/QuerySymbol";
 import WithTooltip from "../../tooltip/WithTooltip";
 
+import Highlighter from "react-highlight-words";
 import { DeleteProjectItemButton } from "./DeleteProjectItemButton";
 import ProjectItemLabel from "./ProjectItemLabel";
 import { useUpdateFormConfig, useUpdateQuery } from "./actions";
@@ -159,6 +160,9 @@ const ProjectItem = forwardRef<
   ref,
 ) {
   const { t } = useTranslation();
+  const highlightedWords = useSelector<StateT, string[]>(
+    (state) => state.projectItemsSearch.words,
+  );
 
   const loadedSecondaryIds = useSelector<StateT, SecondaryId[]>(
     (state) => state.conceptTrees.secondaryIds,
@@ -291,10 +295,21 @@ const ProjectItem = forwardRef<
             label={label}
             selectTextOnMount={true}
             onSubmit={onRenameLabel}
+            highlightedWords={highlightedWords}
             isEditing={isEditingLabel}
             setIsEditing={setIsEditingLabel}
           />
-          <OwnerName>{item.ownerName}</OwnerName>
+          <OwnerName>
+            {highlightedWords.length > 0 ? (
+              <Highlighter
+                searchWords={highlightedWords}
+                autoEscape
+                textToHighlight={item.ownerName}
+              />
+            ) : (
+              item.ownerName
+            )}
+          </OwnerName>
         </LabelRow>
       </Content>
     </Root>

frontend/src/js/previous-queries/list/ProjectItemLabel.tsx

@@ -1,10 +1,7 @@
 import styled from "@emotion/styled";
-import { FC } from "react";
 import Highlighter from "react-highlight-words";
 import { useTranslation } from "react-i18next";
-import { useSelector } from "react-redux";
 
-import type { StateT } from "../../app/reducers";
 import EditableText from "../../ui-components/EditableText";
 
 const Text = styled("div")`
@@ -21,32 +18,25 @@ const SxEditableText = styled(EditableText)`
   text-overflow: ellipsis;
 `;
 
-const useHighlightedWords = () => {
-  return useSelector<StateT, string[]>(
-    (state) => state.projectItemsSearch.words,
-  );
-};
-
-interface PropsT {
-  mayEdit?: boolean;
-  label: string;
-  selectTextOnMount: boolean;
-  loading?: boolean;
-  onSubmit: (text: string) => void;
-  isEditing: boolean;
-  setIsEditing: (value: boolean) => void;
-}
-
-const ProjectItemLabel: FC<PropsT> = ({
+const ProjectItemLabel = ({
   mayEdit,
   loading,
   selectTextOnMount,
   label,
+  highlightedWords,
   onSubmit,
   isEditing,
   setIsEditing,
+}: {
+  mayEdit?: boolean;
+  label: string;
+  highlightedWords: string[];
+  selectTextOnMount: boolean;
+  loading?: boolean;
+  onSubmit: (text: string) => void;
+  isEditing: boolean;
+  setIsEditing: (value: boolean) => void;
 }) => {
-  const highlightedWords = useHighlightedWords();
   const { t } = useTranslation();
 
   return mayEdit ? (

frontend/src/js/previous-queries/list/selector.ts

@@ -8,6 +8,13 @@ import type { ProjectItemsFilterStateT } from "../filter/reducer";
 
 import type { FormConfigT, PreviousQueryT } from "./reducer";
 
+const queryHasOwner = (query: PreviousQueryT, searchTerm: string) => {
+  return (
+    !!query.ownerName &&
+    query.ownerName.toLowerCase().indexOf(searchTerm.toLowerCase()) !== -1
+  );
+};
+
 const queryHasTag = (query: PreviousQueryT, searchTerm: string) => {
   return (
     !!query.tags &&
@@ -66,7 +73,8 @@ export const queryMatchesSearch = (
     !exists(searchTerm) ||
     queryHasId(query, searchTerm) ||
     queryHasLabel(query, searchTerm) ||
-    queryHasTag(query, searchTerm)
+    queryHasTag(query, searchTerm) ||
+    queryHasOwner(query, searchTerm)
   );
 };