Feature/Enablement area pagination

redisinsight/ui/src/constants/mocks/mock-enablement-area.ts

@@ -1,35 +1,59 @@
 import { EnablementAreaComponent, IEnablementAreaItem } from 'uiSrc/slices/interfaces'
 
-export const MOCK_ENABLEMENT_AREA_ITEMS: IEnablementAreaItem[] = [
-  {
+export const MOCK_ENABLEMENT_AREA_ITEMS: Record<string, IEnablementAreaItem> = {
+  'quick-guides': {
     type: EnablementAreaComponent.Group,
     id: 'quick-guides',
     label: 'Quick Guides',
-    children: [
-      {
+    children: {
+      'document-capabilities': {
         type: EnablementAreaComponent.InternalLink,
         id: 'document-capabilities',
         label: 'Document Capabilities',
         args: {
-          path: 'static/workbench/guides/document-capabilities.html',
+          path: 'static/workbench/quick-guides/document-capabilities.html',
+        },
+      },
+      'working-with-json': {
+        type: EnablementAreaComponent.InternalLink,
+        id: 'working-with-json',
+        label: 'Working with JSON',
+        args: {
+          path: 'static/workbench/quick-guides/working-with-json.html',
+        },
+      },
+      'working-with-hash': {
+        type: EnablementAreaComponent.InternalLink,
+        id: 'working-with-hash',
+        label: 'Working with HASH',
+        args: {
+          path: 'static/workbench/quick-guides/working-with-hash.html',
         },
       }
-    ]
+    }
   },
-  {
+  'internal-page': {
     type: EnablementAreaComponent.InternalLink,
     id: 'internal-page',
     label: 'Internal Page',
     args: {
-      path: 'static/workbench/guides/document-capabilities.html'
+      path: 'static/workbench/quick-guides/document-capabilities.html'
+    },
+  },
+  'second-internal-page': {
+    type: EnablementAreaComponent.InternalLink,
+    id: 'second-internal-page',
+    label: 'Second Internal Page',
+    args: {
+      path: 'static/workbench/quick-guides/document-capabilities.html'
     },
   },
-  {
+  'manual': {
     type: EnablementAreaComponent.CodeButton,
     id: 'manual',
     label: 'Manual',
     args: {
-      path: 'static/workbench/scripts/manual.txt'
+      path: 'static/workbench/_scripts/manual.txt'
     },
   }
-]
+}

redisinsight/ui/src/packages/enablement-area/enablement-area.json

@@ -1,63 +1,63 @@
-[
-  {
+{
+  "quick-guides": {
     "type": "group",
     "id": "quick-guides",
     "label": "QUICK GUIDES",
     "args": {
       "withBorder": true,
       "initialIsOpen": true
     },
-    "children": [
-      {
+    "children": {
+      "document": {
         "type": "group",
         "id": "document",
         "label": "Document",
         "args": {
           "initialIsOpen": true
         },
-        "children": [
-          {
+        "children": {
+          "introduction": {
             "type": "internal-link",
             "id": "introduction",
             "label": "Introduction",
             "args": {
-              "path": "/static/workbench/guides/document/introduction.html"
+              "path": "/static/workbench/quick-guides/document/introduction.html"
             }
           },
-          {
+          "working-with-hashes": {
             "type": "internal-link",
             "id": "working-with-hashes",
             "label": "Working with Hashes",
             "args": {
-              "path": "/static/workbench/guides/document/working-with-hashes.html"
+              "path": "/static/workbench/quick-guides/document/working-with-hashes.html"
             }
           },
-          {
+          "working-with-json": {
             "type": "internal-link",
             "id": "working-with-json",
             "label": "Working with JSON",
             "args": {
-              "path": "/static/workbench/guides/document/working-with-json.html"
+              "path": "/static/workbench/quick-guides/document/working-with-json.html"
             }
           },
-          {
+          "learn-more": {
             "type": "internal-link",
             "id": "learn-more",
             "label": "Learn More",
             "args": {
-              "path": "/static/workbench/guides/document/learn-more.html"
+              "path": "/static/workbench/quick-guides/document/learn-more.html"
             }
           }
-        ]
+        }
       }
-    ]
+    }
   },
-  {
+  "manual": {
     "type": "code-button",
     "id": "manual",
     "label": "Manual",
     "args": {
-      "path": "/static/workbench/scripts/manual.txt"
+      "path": "/static/workbench/_scripts/manual.txt"
     }
   }
-]
+}

redisinsight/ui/src/packages/enablement-area/guides/document/introduction.html → redisinsight/ui/src/packages/enablement-area/quick-guides/document/introduction.html

@@ -67,19 +67,4 @@ <h3>PRE-REQUISITES</h3>
       You could also create a free and ready to use instance on <a href="https://redis.com/try-free/?utm_source=redis&utm_medium=app&utm_campaign=redisinsight_doc_guide" target="_blank">Redis Cloud</a>.
     </p>
   </div>
-  <div style="width: 100%" class="sticky-footer">
-    <div style="width: 100%">
-      <InternalLink
-        size="xs"
-        path="/static/workbench/guides/document/working-with-hashes.html"
-        label="Working with Hashes"
-        iconType="arrowRight"
-        iconPosition="right"
-        testId="next-page"
-        toolTip="Working with Hashes"
-      >
-        <span>Next:<b> Working with Hashes</b></span>
-      </InternalLink>
-    </div>
-  </div>
 </article>

redisinsight/ui/src/packages/enablement-area/guides/document/learn-more.html → redisinsight/ui/src/packages/enablement-area/quick-guides/document/learn-more.html

@@ -37,19 +37,4 @@ <h3>Tutorials</h3>
       </ul>
     </div>
   </div>
-  <div style="width: 100%" class="sticky-footer">
-    <div style="width: 100%;">
-      <InternalLink
-        size="xs"
-        path="/static/workbench/guides/document/working-with-json.html"
-        label="Working with JSON"
-        iconType="arrowLeft"
-        iconPosition="left"
-        testId="prev-page"
-        toolTip="Working with JSON"
-      >
-        <span>Previous:<b> Working with JSON</b></span>
-      </InternalLink>
-    </div>
-  </div>
 </article>

redisinsight/ui/src/packages/enablement-area/guides/document/working-with-hashes.html → redisinsight/ui/src/packages/enablement-area/quick-guides/document/working-with-hashes.html

@@ -8,25 +8,25 @@
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Create"
-              path="/static/workbench/scripts/document/working-with-hashes/crud-create.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/crud-create.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Read"
-              path="/static/workbench/scripts/document/working-with-hashes/crud-read.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/crud-read.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Update"
-              path="/static/workbench/scripts/document/working-with-hashes/crud-update.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/crud-update.txt"
             />
           </div>
            <div style="margin: 8px 0">
             <LazyCodeButton
               label="Delete"
-              path="/static/workbench/scripts/document/working-with-hashes/crud-delete.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/crud-delete.txt"
             />
           </div>
         </span>
@@ -37,19 +37,19 @@
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Create hash index"
-              path="/static/workbench/scripts/document/working-with-hashes/create-hash-index.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/create-hash-index.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="List all indexes"
-              path="/static/workbench/scripts/document/working-with-hashes/list-all-indexes.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/list-all-indexes.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Index info"
-              path="/static/workbench/scripts/document/working-with-hashes/index-info.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/index-info.txt"
             />
           </div>
         </span>
@@ -60,114 +60,77 @@
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Exact text search"
-              path="/static/workbench/scripts/document/working-with-hashes/exact-text-search.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/exact-text-search.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Fuzzy text search"
-              path="/static/workbench/scripts/document/working-with-hashes/fuzzy-text-search.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/fuzzy-text-search.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Field specific text search"
-              path="/static/workbench/scripts/document/working-with-hashes/field-specific-text-search.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/field-specific-text-search.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Numeric range query"
-              path="/static/workbench/scripts/document/working-with-hashes/numeric-range-query.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/numeric-range-query.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Tag search"
-              path="/static/workbench/scripts/document/working-with-hashes/tag-search.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/tag-search.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Multiple tags (OR) search"
-              path="/static/workbench/scripts/document/working-with-hashes/multiple-tags-or-search.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/multiple-tags-or-search.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Multiple tags (AND) search"
-              path="/static/workbench/scripts/document/working-with-hashes/multiple-tags-and-search.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/multiple-tags-and-search.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Combined search on two fields (AND)"
-              path="/static/workbench/scripts/document/working-with-hashes/combined-search-with-and.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/combined-search-with-and.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Combined search on two fields (OR)"
-              path="/static/workbench/scripts/document/working-with-hashes/combined-search-with-or.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/combined-search-with-or.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Combined search and geo filter"
-              path="/static/workbench/scripts/document/working-with-hashes/combined-search-with-geo-filter.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/combined-search-with-geo-filter.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Group by & sort by aggregation"
-              path="/static/workbench/scripts/document/working-with-hashes/group-and-sort-by-aggregation.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/group-and-sort-by-aggregation.txt"
             />
           </div>
           <div style="margin: 8px 0">
             <LazyCodeButton
               label="Aggregation with apply"
-              path="/static/workbench/scripts/document/working-with-hashes/aggregation-with-apply.txt"
+              path="/static/workbench/_scripts/document/working-with-hashes/aggregation-with-apply.txt"
             />
           </div>
         </span>
       </li>
     </ol>
   </div>
-  <div style="width: 100%" class="sticky-footer">
-    <div style="width: 100%; display: flex;">
-      <div style="width: 50%; border-right: 1px solid var(--separatorColor)">
-        <InternalLink
-          size="xs"
-          path="/static/workbench/guides/document/introduction.html"
-          label="Introduction"
-          iconType="arrowLeft"
-          testId="prev-page"
-          toolTip="Introduction"
-        >
-          <span>
-            <span>Previous:</span>
-            <br>
-            <b>Introduction</b>
-          </span>
-        </InternalLink>
-      </div>
-      <div style="width: 50%">
-        <InternalLink
-          size="xs"
-          path="/static/workbench/guides/document/working-with-json.html"
-          label="Working with JSON"
-          iconType="arrowRight"
-          iconPosition="right"
-          testId="next-page"
-          toolTip="Working with JSON"
-        >
-          <span>
-            <span style="padding-left: 8px">Next:</span>
-            <br>
-            <b style="padding-left: 8px">Working with JSON</b>
-          </span>
-        </InternalLink>
-      </div>
-    </div>
-  </div>
 </article>