Revert "fix: Log searche feedbacks (#10088)"

This reverts commit 935fa66.
determined-ai · Nov 12, 2024 · 09fecb3 · 09fecb3
1 parent 11a2581
commit 09fecb3
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 25 deletions.
diff --git a/webui/react/src/pages/TrialDetails/LogViewer.tsx b/webui/react/src/pages/TrialDetails/LogViewer.tsx
@@ -33,7 +33,6 @@ export interface Props<T> {
     idSet: Set<RecordKey>;
     isScrollReady: boolean;
   }>;
-  scrollToIndex: number;
 }
 
 export interface ViewerLog extends Log {
@@ -101,7 +100,6 @@ function LogViewer<T>({
   setLogs,
   logsRef,
   local,
-  scrollToIndex,
 }: Props<T>): JSX.Element {
   const componentId = useId();
 
@@ -140,11 +138,6 @@ function LogViewer<T>({
     [setLogs],
   );
 
-  useEffect(() => {
-    if (scrollToIndex < 0) return;
-    virtuosoRef.current?.scrollToIndex({ index: scrollToIndex });
-  }, [scrollToIndex]);
-
   useEffect(() => {
     setScrolledForSearch(false);
   }, [selectedLog]);
@@ -153,7 +146,7 @@ function LogViewer<T>({
     if (scrolledForSearch || !selectedLog || !local.current.isScrollReady) return;
     setTimeout(() => {
       const index = logs.findIndex((l) => l.id === selectedLog.id);
-      if (index > -1) {
+      if (index > -1 && index + 1 < logs.length) {
         virtuosoRef.current?.scrollToIndex({
           behavior: 'smooth',
           index: index,

diff --git a/webui/react/src/pages/TrialDetails/TrialDetailsLogs.module.scss b/webui/react/src/pages/TrialDetails/TrialDetailsLogs.module.scss
@@ -30,7 +30,6 @@
       .log {
         cursor: pointer;
         font-family: var(--theme-font-family-code);
-        font-size: 12px;
 
         &:hover {
           color: var(--theme-ix-on-active);

diff --git a/webui/react/src/pages/TrialDetails/TrialDetailsLogs.tsx b/webui/react/src/pages/TrialDetails/TrialDetailsLogs.tsx
@@ -60,11 +60,10 @@ const TrialDetailsLogs: React.FC<Props> = ({ experiment, trial }: Props) => {
   const [logs, setLogs] = useState<ViewerLog[]>([]);
   const [searchOn, setSearchOn] = useState<boolean>(false);
   const [logViewerOn, setLogViewerOn] = useState<boolean>(true);
-  const [searchInput, setSearchInput] = useState<string | undefined>(undefined);
+  const [searchInput, setSearchInput] = useState<string>('');
   const [searchResults, setSearchResults] = useState<TrialLog[]>([]);
   const [selectedLog, setSelectedLog] = useState<ViewerLog>();
   const [searchWidth, setSearchWidth] = useState(INITIAL_SEARCH_WIDTH);
-  const [scrollToIndex, setScrollToIndex] = useState(-1);
   const confirm = useConfirm();
   const canceler = useRef(new AbortController());
   const container = useRef<HTMLDivElement>(null);
@@ -106,8 +105,10 @@ const TrialDetailsLogs: React.FC<Props> = ({ experiment, trial }: Props) => {
       updateSettings({
         agentId: filters.agentIds,
         containerId: filters.containerIds,
+        enableRegex: filters.enableRegex,
         level: filters.levels,
         rankId: filters.rankIds,
+        searchText: filters.searchText,
       });
     },
     [updateSettings],
@@ -291,9 +292,7 @@ const TrialDetailsLogs: React.FC<Props> = ({ experiment, trial }: Props) => {
 
       const logEntry = formatLogEntry(l);
 
-      const i = settings.enableRegex
-        ? content.match(`${key}`)?.index
-        : content.toLowerCase().indexOf(key.toLowerCase());
+      const i = settings.enableRegex ? content.match(`${key}`)?.index : content.indexOf(key);
       if (_.isUndefined(i) || i < 0) return;
       const keyLen = settings.enableRegex ? content.match(`${key}`)?.[0].length || 0 : key.length;
       const j = i + keyLen;
@@ -448,14 +447,6 @@ const TrialDetailsLogs: React.FC<Props> = ({ experiment, trial }: Props) => {
     if (logsRef.current && screenfull.isEnabled) screenfull.toggle();
   }, []);
 
-  const onSwitchSearch = useCallback(() => {
-    setSearchOn((prev) => !prev);
-    // open log pane when closing the search pane
-    searchOn && setLogViewerOn(true);
-    // sometime the selected log of the log pane would offset when closing the search pane, since the width of the log pane changes
-    searchOn && selectedLog && setScrollToIndex(logs.findIndex((l) => l.id === selectedLog.id));
-  }, [searchOn, selectedLog, logs]);
-
   const rightButtons = (
     <Row>
       <ClipboardButton copiedMessage={clipboardCopiedMessage} getContent={getClipboardContent} />
@@ -480,11 +471,16 @@ const TrialDetailsLogs: React.FC<Props> = ({ experiment, trial }: Props) => {
             <Input
               allowClear
               placeholder="Search Logs..."
-              value={searchInput ?? settings.searchText}
+              value={searchInput || settings.searchText}
               width={240}
               onChange={onSearchChange}
             />
-            <Button type={searchOn ? 'primary' : 'default'} onClick={onSwitchSearch}>
+            <Button
+              type={searchOn ? 'primary' : 'default'}
+              onClick={() => {
+                setSearchOn((prev) => !prev);
+                searchOn && setLogViewerOn(true);
+              }}>
               <Icon name="search" showTooltip title={`${searchOn ? 'Close' : 'Open'} Search`} />
             </Button>
             <Button
@@ -512,7 +508,6 @@ const TrialDetailsLogs: React.FC<Props> = ({ experiment, trial }: Props) => {
                 local={local}
                 logs={logs}
                 logsRef={logsRef}
-                scrollToIndex={scrollToIndex}
                 selectedLog={selectedLog}
                 serverAddress={serverAddress}
                 setLogs={setLogs}