fixed sorting for ASC and DESC

Author: talhainvenxion

src/ui/layouts/common/Table/index.tsx

@@ -167,7 +167,6 @@ export const Table: React.FC<TableProps> = ({
   const isValidFilterForCategory: any =
     isValidFilterFroValue && filters?.map((f) => f.type.value).join('');
   const checkValidFilter = isValidFilterFroValue + isValidFilterForCategory;
-  console.log(checkValidFilter, 'checkValidFilter');
 
   const { dispatchStackData } = callActionForStacksForPagination();
   const {
@@ -197,7 +196,7 @@ export const Table: React.FC<TableProps> = ({
     if (filters) {
       setPageIndex(0);
     }
-    if (checkValidFilter) {
+    if (checkValidFilter || activeSorting || checkForLocationPath) {
       switch (componentName) {
         case 'stacks':
           if (CheckIfRun) {
@@ -272,12 +271,7 @@ export const Table: React.FC<TableProps> = ({
     }
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [
-    checkForLocationPath,
-    checkValidFilter,
-    activeSorting,
-    activeSortingDirection,
-  ]);
+  }, [checkForLocationPath, checkValidFilter, activeSorting]);
   let rowsToDisplay = tableRows;
   // function getFetchedState(state: any) {
   //   setFetchingMembers(state);

src/ui/layouts/pipelines/PipelineDetail/Runs/index.tsx

@@ -9,7 +9,7 @@ export const Runs: React.FC<{ pipelineId: TId; filter: any }> = ({
 }) => {
   const [sortBy, setSortBy] = useState('created');
   function getSorted(activeSorting: any, activeSortingDirection: any) {
-    setSortBy(activeSorting);
+    setSortBy(activeSortingDirection?.toLowerCase() + ':' + activeSorting);
     // console.log(activeSorting, activeSortingDirection, 'aaaaaaa');
   }
   const { fetching, runIds, runsPaginated } = useService({

src/ui/layouts/pipelines/Pipelines/AllRuns/index.tsx

@@ -15,7 +15,7 @@ interface Props {
 export const AllRuns: React.FC<Props> = ({ filter }: Props) => {
   const [sortBy, setSortBy] = useState('created');
   function getSorted(activeSorting: any, activeSortingDirection: any) {
-    setSortBy(activeSorting);
+    setSortBy(activeSortingDirection?.toLowerCase() + ':' + activeSorting);
     // console.log(activeSorting, activeSortingDirection, 'aaaaaaa');
   }
 

src/ui/layouts/pipelines/Pipelines/List/index.tsx

@@ -66,7 +66,9 @@ export const List: React.FC<Props> = ({ filter }: Props) => {
           />
         )}
         activeSortingDirection={activeSortingDirection}
-        activeSorting={activeSorting}
+        activeSorting={
+          activeSortingDirection?.toLowerCase() + ':' + activeSorting
+        }
         // activeSorting={
         //   activeSorting !== 'created' && activeSortingDirection !== 'ASC'
         //     ? activeSorting

src/ui/layouts/pipelines/Pipelines/List/useService.ts

@@ -48,7 +48,7 @@ export const useService = (
   const [
     activeSortingDirection,
     setActiveSortingDirection,
-  ] = React.useState<SortingDirection | null>('DESC');
+  ] = React.useState<SortingDirection | null>('ASC');
 
   const dispatch = useDispatch();
 
@@ -70,10 +70,11 @@ export const useService = (
   useEffect(() => {
     if (!isValidFilter) {
       const intervalId = setInterval(() => {
-        //assign interval to a variable to clear it.
+        const applySorting =
+          activeSortingDirection?.toLowerCase() + ':' + activeSorting;
         dispatch(
           pipelinesActions.getMy({
-            sort_by: activeSorting ? activeSorting : 'created',
+            sort_by: applySorting ? applySorting : 'created',
             logical_operator: 'and',
             // name: '',
             project: selectedProject,

src/ui/layouts/pipelines/RunsTable/index.tsx

@@ -72,13 +72,16 @@ export const RunsTable: React.FC<{
     if (getSorted) {
       getSorted(activeSorting, activeSortingDirection);
     }
+    console.log(activeSortingDirection, 'activeSortingDirection');
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [getSorted]);
 
   return (
     <Table
       activeSortingDirection={activeSortingDirection}
-      activeSorting={activeSorting}
+      activeSorting={
+        activeSortingDirection?.toLowerCase() + ':' + activeSorting
+      }
       // activeSorting={
       //   activeSorting !== 'created' && activeSortingDirection !== 'ASC'
       //     ? activeSorting

src/ui/layouts/pipelines/RunsTable/useService.ts

@@ -46,7 +46,7 @@ export const useService = ({
   const [
     activeSortingDirection,
     setActiveSortingDirection,
-  ] = React.useState<SortingDirection | null>('DESC');
+  ] = React.useState<SortingDirection | null>('ASC');
   const [sortedRuns, setSortedRuns] = React.useState<TRun[]>([]);
 
   const runs = pipelineRuns

src/ui/layouts/runs/RunsTable/useService.ts

@@ -27,19 +27,19 @@ export const useService = ({ runIds }: { runIds: TId[] }): ServiceInterface => {
   const [
     activeSortingDirection,
     setActiveSortingDirection,
-  ] = React.useState<SortingDirection | null>('DESC');
+  ] = React.useState<SortingDirection | null>('ASC');
   const [sortedRuns, setSortedRuns] = React.useState<TRun[]>([]);
 
   const runs = useSelector(runSelectors.forRunIds(runIds));
 
   useEffect(() => {
-    const orderedRuns = _.orderBy(
-      runs,
-      [activeSorting],
-      [activeSortingDirection === 'DESC' ? 'desc' : 'asc'],
-    );
+    // const orderedRuns = _.orderBy(
+    //   runs,
+    //   [activeSorting],
+    //   [activeSortingDirection === 'DESC' ? 'desc' : 'asc'],
+    // );
 
-    setSortedRuns(orderedRuns as TRun[]);
+    setSortedRuns(runs as TRun[]);
   }, []);
   useEffect(() => {
     return () => {

src/ui/layouts/settings/Organization/useService.ts

@@ -33,7 +33,7 @@ export const useService = (): ServiceInterface => {
   const [
     activeSortingDirection,
     setActiveSortingDirection,
-  ] = React.useState<SortingDirection | null>('DESC');
+  ] = React.useState<SortingDirection | null>('ASC');
   const dispatch = useDispatch();
 
   const members = useSelector(organizationSelectors.myMembers);

src/ui/layouts/stackComponents/RunsTable/index.tsx

@@ -67,7 +67,9 @@ export const RunsTable: React.FC<{
   return (
     <Table
       activeSortingDirection={activeSortingDirection}
-      activeSorting={activeSorting}
+      activeSorting={
+        activeSortingDirection?.toLowerCase() + ':' + activeSorting
+      }
       // activeSorting={
       //   activeSorting !== 'created' && activeSortingDirection !== 'ASC'
       //     ? activeSorting