Merge pull request #743 from contentstack/bugfix/audit-log

bugfix: streamline audit and  execution logs processing and enhance UI components

Author: sayalijoshi27

api/src/services/migration.service.ts

@@ -901,14 +901,6 @@ const getLogs = async (req: Request): Promise<any> => {
       const filterOptions = Array?.from(new Set(logEntries?.map((log) => log?.level)));
       const auditStartIndex = logEntries?.findIndex?.(log => log?.message?.includes("Starting audit process"));
       const auditEndIndex = logEntries?.findIndex?.(log => log?.message?.includes("Audit process completed"));
-      if (auditStartIndex === -1 || auditEndIndex === -1) {
-        logger.warn("Audit markers not found in logs. Skipping audit-related slicing.");
-      } else {
-        logEntries = [
-          ...logEntries.slice(0, auditStartIndex),
-          ...logEntries.slice(auditEndIndex + 1)
-        ];
-      }
       logEntries = logEntries?.slice?.(1, logEntries?.length - 2);
       if (filter !== "all") {
         const filters = filter?.split("-") ?? [];

ui/src/components/AuditFilterModal/index.scss

@@ -20,7 +20,11 @@
     border-bottom: 1px solid #e5e7eb;
     display: flex;
     align-items: center;
-    justify-content: space-between;
+    justify-content: flex-start;
+    gap: 12px;
+    .close-btn {
+        margin-left: auto;
+    }
 }
 
 .tableFilterModalStories__suggestion-item {
@@ -82,4 +86,4 @@
 .text-size {
     font-size: $size-font-medium;
     line-height: $line-height-reset;
-}
+}

ui/src/components/AuditFilterModal/index.tsx

@@ -17,7 +17,7 @@ const AuditFilterModal = ({
     onApply,
     selectedLevels,
     setFilterValue,
-    selectedFileType
+    selectedFileType,
 }: AuditFilterModalProps) => {
     const modalRef = useRef<HTMLDivElement>(null);
 
@@ -71,7 +71,7 @@ const AuditFilterModal = ({
         <div className="tableFilterModalStories" ref={modalRef}>
             <div className="tableFilterModalStories__header">
                 <span className="text-size">
-                    {selectedFileType?.includes?.('Entries') ? 'Display Type' : 'Field Type'}
+                    {selectedFileType?.includes?.(auditLogsConstants.filterModal.entries) ? auditLogsConstants.filterModal.displayType : auditLogsConstants.filterModal.selectFieldType}
                 </span>
                 <div className="close-btn">
                     <Icon version="v2" icon="CloseNoborder" size="medium" onClick={closeModal} />

ui/src/components/AuditLogs/index.tsx

@@ -72,6 +72,7 @@ const AuditLogs: React.FC = () => {
                 { label: 'Entries', value: 'Entries_Select_feild' }
             ];
             setFileOptions(predefinedOptions);
+            handleFileChange(predefinedOptions?.[0]);
         }
     };
     const handleStackChange = async (selectedOption: StackOption | null) => {
@@ -148,10 +149,7 @@ const AuditLogs: React.FC = () => {
             setTableUid((prevUid) => prevUid + 1);
         }
     };
-    const handleSearchChange = (value: string) => {
-        setSearchText(value);
-        setTableUid((prevUid) => prevUid + 1);
-    };
+
     const ColumnFilter = () => {
         const closeModal = () => {
             setIsFilterDropdownOpen(false);
@@ -408,8 +406,8 @@ const AuditLogs: React.FC = () => {
                 columnSelector={false}
                 canSearch={true}
                 searchPlaceholder={auditLogsConstants?.placeholders?.searchLogs}
-                searchValue={searchText}
-                onSearchChangeEvent={handleSearchChange}
+                searchValue={searchText ?? ''}
+                onSearchChangeEvent={(value: string) => setSearchText(value)}
                 withExportCta={{
                     component: exportCtaComponent,
                     showExportCta: true

ui/src/components/FilterModal/FilterModal.scss

@@ -12,6 +12,23 @@
   max-height: 350px;
   overflow: hidden;
   font-family: 'Inter', sans-serif;
+  top: 100%;
+  left: 0;
+  margin-top: 8px;
+
+  &.position-bottom {
+    top: auto;
+    bottom: 0;
+    left: 0;
+    margin-top: 0;
+    margin-bottom: 8px;
+  }
+
+  &.position-right {
+    left: auto;
+    right: 0;
+  }
+
 }
 
 .tableFilterModalStories__header {
@@ -27,12 +44,6 @@
   padding: 8px 16px;
 }
 
-.tableFilterModalStories__body{
-  overflow: scroll;
-  max-height: 250px;
-  overflow-x: hidden;
-}
-
 .Checkbox {
   display: flex;
   align-items: center;

ui/src/components/FilterModal/FilterModal.tsx

@@ -36,9 +36,9 @@ const FilterModal = ({
                 <div className="tableFilterModalStories__suggestion-item">
                   <Checkbox
                     checked={selectedLevels?.some?.((v) => v?.value === item?.value) || false}
-                    onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                       updateValue?.({ value: item, isChecked: e?.target?.checked })
-                    }
+                    }}
                     version="v2"
                     label={item?.label || ''}
                     className="text-size"
@@ -52,7 +52,7 @@ const FilterModal = ({
 
       {/* Modal Footer */}
       <div className="tableFilterModalStories__footer">
-        <Button buttonType="tertiary" version="v2" onClick={clearAll}>
+        <Button buttonType="tertiary" version="v2" onClick={clearAll} disabled={selectedLevels?.length === 0}>
           Clear All
         </Button>
         <ButtonGroup>

ui/src/utilities/constants.ts

@@ -121,11 +121,11 @@ export const VALIDATION_DOCUMENTATION_URL: { [key: string]: string } = {
 
 
 export const auditLogsConstants = {
-  executeTestMigration: 'Try executing Test Migration',
-  selectModuleMessage: 'Select Module to See the Logs',
-  queryChangeMessage: 'Try Changing the Search Query to find what you are looking for',
-  noResult: 'No Matching Result Found',
-  noLogs: 'No Logs Found',
+  executeTestMigration: 'Try executing the migration',
+  selectModuleMessage: 'Select a module to see the logs',
+  queryChangeMessage: 'Try changing the search query to find what you are looking for.',
+  noResult: 'No matching result found',
+  noLogs: 'No logs',
   filterIcon: {
     filterOn: 'filterWithAppliedIcon Icon--v2 Icon--medium',
     filterOff: 'filterWithAppliedIcon Icon--v2 Icon--medium Icon--disabled'
@@ -144,7 +144,10 @@ export const auditLogsConstants = {
   filterModal: {
     noFilterAvailable: 'No Filters Available',
     clearAll: 'Clear All',
-    apply: 'Apply'
+    apply: 'Apply',
+    displayType: 'Display Type',
+    selectFieldType: 'Select Field Data Type',
+    entries: 'Entries',
   }
 };
 
@@ -166,12 +169,12 @@ export const EXECUTION_LOGS_UI_TEXT = {
   SEARCH_PLACEHOLDER: 'Search Execution Logs',
   SELECT_PLACEHOLDER: 'Select a stack',
   EMPTY_STATE_DESCRIPTION: {
-    NO_RESULT: 'Try Changing the Search Query to find what you are looking for',
-    NO_LOGS: 'Try executing Test Migration'
+    NO_RESULT: 'Try changing the search query to find what you are looking for.',
+    NO_LOGS: 'Try executing the migration'
   },
   EMPTY_STATE_HEADING: {
-    NO_LOGS: 'No Logs Found',
-    NO_MATCH: 'No Matching Result Found'
+    NO_LOGS: 'No logs',
+    NO_MATCH: 'No matching result found'
   },
   EMPTY_STATE_ICON: {
     NO_LOGS: 'NoDataEmptyState',