Merge pull request #124 from devtron-labs/demo/resource-browser

demo: resource browser

Author: vivek-devtron

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.0.80",
+    "version": "0.0.81",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",
@@ -79,9 +79,11 @@
         "react-router": "^5.3.0",
         "react-router-dom": "^5.3.0",
         "react-draggable": "^4.4.5",
+        "yaml": "^2.4.1",
+        "marked": "4.3.0",
+        "dompurify": "^3.0.2",
         "react-ga4": "^1.4.1",
-        "@typeform/embed-react": "2.20.0",
-        "yaml": "^2.4.1"
+        "@typeform/embed-react": "2.20.0"
     },
     "dependencies": {
         "react-monaco-editor": "^0.54.0",

package.json

@@ -55,6 +55,7 @@ export default function ClipboardButton({
                 content={copied ? copiedTippyText : 'Copy'}
                 placement="bottom"
                 visible={copied || enableTippy}
+                arrow={false}
             >
                 <button
                     type="button"

src/Common/ClipboardButton/ClipboardButton.tsx

@@ -729,6 +729,5 @@ export const handleRelativeDateSorting = (dateStringA, dateStringB, sortOrder) =
  * Returns a stringified YAML with default indentation & line width
  */
 
-export const YAMLStringify = (obj: object | unknown, option?: object) => (
-    YAML.stringify(obj, { indent: 2, lineWidth: 0, ...option  })
-)
+export const YAMLStringify = (obj: object | unknown, option?: object) =>
+    YAML.stringify(obj, { indent: 2, lineWidth: 0, ...option })

src/Common/Helper.tsx

@@ -0,0 +1,6 @@
+import { useContext } from 'react'
+import { context } from './UseRegisterShortcutContext'
+
+const useRegisterShortcut = () => useContext(context)
+
+export default useRegisterShortcut

src/Common/Hooks/UseRegisterShortcut/UseRegisterShortcut.tsx

@@ -0,0 +1,4 @@
+import { createContext } from 'react'
+import { UseRegisterShortcutContextType } from './types'
+
+export const context = createContext<UseRegisterShortcutContextType>(null)

src/Common/Hooks/UseRegisterShortcut/UseRegisterShortcutContext.tsx

@@ -0,0 +1,19 @@
+import { useMemo, useState } from 'react'
+import { context } from './UseRegisterShortcutContext'
+import { UseRegisterShortcutProviderType } from './types'
+
+const UseRegisterShortcutProvider = ({ children }: UseRegisterShortcutProviderType) => {
+    const [registerShortcut, setRegisterShortcut] = useState(true)
+
+    const providerValue = useMemo(
+        () => ({
+            registerShortcut,
+            setRegisterShortcut: (allowShortcut: boolean) => setRegisterShortcut(allowShortcut),
+        }),
+        [registerShortcut],
+    )
+
+    return <context.Provider value={providerValue}>{children}</context.Provider>
+}
+
+export default UseRegisterShortcutProvider

src/Common/Hooks/UseRegisterShortcut/UseRegisterShortcutProvider.tsx

@@ -0,0 +1,2 @@
+export { default as useRegisterShortcut } from './UseRegisterShortcut'
+export { default as UseRegisterShortcutProvider } from './UseRegisterShortcutProvider'

src/Common/Hooks/UseRegisterShortcut/index.ts

@@ -0,0 +1,8 @@
+export interface UseRegisterShortcutContextType {
+    registerShortcut: boolean
+    setRegisterShortcut: (allowShortcut: boolean) => void
+}
+
+export interface UseRegisterShortcutProviderType {
+    children: React.ReactElement
+}

src/Common/Hooks/UseRegisterShortcut/types.ts

@@ -2,3 +2,4 @@ export { useSuperAdmin } from './UseSuperAdmin/UseSuperAdmin'
 export { useClickOutside } from './UseClickOutside/UseClickOutside'
 export { useWindowSize } from './UseWindowSize/UseWindowSize'
 export * from './useUrlFilters'
+export * from './UseRegisterShortcut'