Refactor UI folder (#2016)

* Added Overview page

* Revised Getting Started page

* Minor revision

* Edited readme, minor modifications to docs

* Removed sweep.yaml, .devcontainer, .ergomake

* Moved security.md to .github, added contributing.md

* changes as per code review

* updated contributing.md

* fixed broken links & added missing links in doc, improved structure

* fixed link in wsl setup

* fixed server link, added https cloning in yarn-setup

* removed package-lock.json

* added doc card, admonitions

* removed underline from nav buttons

* refactoring modules/ui

* refactoring modules/ui

* Change folder case

* Fix theme location

* Fix case 2

* Fix storybook

---------

Co-authored-by: Nimra Ahmed <nimra1408@gmail.com>
Co-authored-by: Nimra Ahmed <50912134+nimraahmed@users.noreply.github.com>

front/src/modules/ui/data/view-bar/utils/getOperandLabel.ts

@@ -0,0 +1,45 @@
+import { ViewFilterOperand } from '~/generated/graphql';
+
+export const getOperandLabel = (
+  operand: ViewFilterOperand | null | undefined,
+) => {
+  switch (operand) {
+    case ViewFilterOperand.Contains:
+      return 'Contains';
+    case ViewFilterOperand.DoesNotContain:
+      return "Doesn't contain";
+    case ViewFilterOperand.GreaterThan:
+      return 'Greater than';
+    case ViewFilterOperand.LessThan:
+      return 'Less than';
+    case ViewFilterOperand.Is:
+      return 'Is';
+    case ViewFilterOperand.IsNot:
+      return 'Is not';
+    case ViewFilterOperand.IsNotNull:
+      return 'Is not null';
+    default:
+      return '';
+  }
+};
+
+export const getOperandLabelShort = (
+  operand: ViewFilterOperand | null | undefined,
+) => {
+  switch (operand) {
+    case ViewFilterOperand.Is:
+    case ViewFilterOperand.Contains:
+      return ': ';
+    case ViewFilterOperand.IsNot:
+    case ViewFilterOperand.DoesNotContain:
+      return ': Not';
+    case ViewFilterOperand.IsNotNull:
+      return ': NotNull';
+    case ViewFilterOperand.GreaterThan:
+      return '\u00A0> ';
+    case ViewFilterOperand.LessThan:
+      return '\u00A0< ';
+    default:
+      return ': ';
+  }
+};

front/src/modules/ui/data/view-bar/utils/getOperandsForFilterType.ts

@@ -0,0 +1,19 @@
+import { ViewFilterOperand } from '~/generated/graphql';
+
+import { FilterType } from '../types/FilterType';
+
+export const getOperandsForFilterType = (
+  filterType: FilterType | null | undefined,
+): ViewFilterOperand[] => {
+  switch (filterType) {
+    case 'text':
+      return [ViewFilterOperand.Contains, ViewFilterOperand.DoesNotContain];
+    case 'number':
+    case 'date':
+      return [ViewFilterOperand.GreaterThan, ViewFilterOperand.LessThan];
+    case 'entity':
+      return [ViewFilterOperand.Is, ViewFilterOperand.IsNot];
+    default:
+      return [];
+  }
+};

front/src/modules/ui/data/view-bar/utils/helpers.ts

@@ -0,0 +1,16 @@
+import { SortOrder as Order_By } from '~/generated/graphql';
+
+import { Sort } from '../types/Sort';
+
+export const reduceSortsToOrderBy = (sorts: Sort[]): any[] =>
+  sorts
+    .map((sort) => {
+      const direction = sort.direction === 'asc' ? Order_By.Asc : Order_By.Desc;
+
+      if (sort.definition.getOrderByTemplate) {
+        return sort.definition.getOrderByTemplate(direction);
+      } else {
+        return [{ [sort.definition.key]: direction }];
+      }
+    })
+    .flat();

front/src/modules/ui/data/view-bar/utils/turnFilterIntoWhereClause.ts

@@ -0,0 +1,99 @@
+import { QueryMode, ViewFilterOperand } from '~/generated/graphql';
+
+import { Filter } from '../types/Filter';
+
+export const turnFilterIntoWhereClause = (filter: Filter) => {
+  switch (filter.operand) {
+    case ViewFilterOperand.IsNotNull:
+      return {
+        [filter.key]: {
+          not: null,
+        },
+      };
+    default:
+      switch (filter.type) {
+        case 'text':
+          switch (filter.operand) {
+            case ViewFilterOperand.Contains:
+              return {
+                [filter.key]: {
+                  contains: filter.value,
+                  mode: QueryMode.Insensitive,
+                },
+              };
+            case ViewFilterOperand.DoesNotContain:
+              return {
+                [filter.key]: {
+                  not: {
+                    contains: filter.value,
+                    mode: QueryMode.Insensitive,
+                  },
+                },
+              };
+            default:
+              throw new Error(
+                `Unknown operand ${filter.operand} for ${filter.type} filter`,
+              );
+          }
+        case 'number':
+          switch (filter.operand) {
+            case ViewFilterOperand.GreaterThan:
+              return {
+                [filter.key]: {
+                  gte: parseFloat(filter.value),
+                },
+              };
+            case ViewFilterOperand.LessThan:
+              return {
+                [filter.key]: {
+                  lte: parseFloat(filter.value),
+                },
+              };
+            default:
+              throw new Error(
+                `Unknown operand ${filter.operand} for ${filter.type} filter`,
+              );
+          }
+        case 'date':
+          switch (filter.operand) {
+            case ViewFilterOperand.GreaterThan:
+              return {
+                [filter.key]: {
+                  gte: filter.value,
+                },
+              };
+            case ViewFilterOperand.LessThan:
+              return {
+                [filter.key]: {
+                  lte: filter.value,
+                },
+              };
+            default:
+              throw new Error(
+                `Unknown operand ${filter.operand} for ${filter.type} filter`,
+              );
+          }
+        case 'entity':
+          switch (filter.operand) {
+            case ViewFilterOperand.Is:
+              return {
+                [filter.key]: {
+                  equals: filter.value,
+                },
+              };
+            case ViewFilterOperand.IsNot:
+              return {
+                [filter.key]: {
+                  not: { equals: filter.value },
+                },
+              };
+            default:
+              throw new Error(
+                `Unknown operand ${filter.operand} for ${filter.type} filter`,
+              );
+          }
+        default:
+          throw new Error('Unknown filter type');
+      }
+  }
+};