Merge pull request #195 from PRO-Robotech/feature/dev

remove flickering | currenttags parser in sidebars

Author: typescreep

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@prorobotech/openapi-k8s-toolkit",
-  "version": "0.0.1-alpha.136",
+  "version": "0.0.1-alpha.137",
   "description": "ProRobotech OpenAPI k8s tools",
   "main": "dist/openapi-k8s-toolkit.cjs.js",
   "module": "dist/openapi-k8s-toolkit.es.js",

package.json

@@ -132,6 +132,11 @@ export const prepareDataForManageableSidebar = ({
     return undefined
   }
 
+  const preparedCurrentTags =
+    currentTags && currentTags.length > 0
+      ? currentTags.map(el => prepareTemplate({ template: el, replaceValues }))
+      : undefined
+
   const result = {
     menuItems: mapLinksFromRaw({
       rawLinks: foundData.menuItems,
@@ -144,7 +149,7 @@ export const prepareDataForManageableSidebar = ({
     ? findMatchingItems({
         items: result?.menuItems,
         pathname,
-        tags: { keysAndTags: foundData.keysAndTags, currentTags },
+        tags: { keysAndTags: foundData.keysAndTags, currentTags: preparedCurrentTags },
       })
     : []
   const stringedOpenedKeys = openedKeys.map(el => (typeof el === 'string' ? el : String(el)))

src/components/molecules/ManageableSidebar/utils.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import React, { FC } from 'react'
 import { Typography } from 'antd'
+import { useNavigate } from 'react-router-dom'
 import { TDynamicComponentsAppTypeMap } from '../../types'
 import { useMultiQuery } from '../../../DynamicRendererWithProviders/multiQueryProvider'
 import { usePartsOfUrl } from '../../../DynamicRendererWithProviders/partsOfUrlContext'
@@ -13,6 +14,8 @@ export const AntdLink: FC<{ data: TDynamicComponentsAppTypeMap['antdLink']; chil
   const { data: multiQueryData, isLoading: isMultiqueryLoading } = useMultiQuery()
   const partsOfUrl = usePartsOfUrl()
 
+  const navigate = useNavigate()
+
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const { id, text, href, ...linkProps } = data
 
@@ -30,7 +33,14 @@ export const AntdLink: FC<{ data: TDynamicComponentsAppTypeMap['antdLink']; chil
   }
 
   return (
-    <Typography.Link href={hrefPrepared} {...linkProps}>
+    <Typography.Link
+      href={hrefPrepared}
+      onClick={e => {
+        e.preventDefault()
+        navigate(hrefPrepared)
+      }}
+      {...linkProps}
+    >
       {textPrepared}
       {children}
     </Typography.Link>