@devtron-labs/devtron-fe-common-lib 0.0.52 → 0.0.53-beta-2

package/.eslintignore

@@ -0,0 +1,96 @@
+.eslintrc.js
+
+# Files with ESLint errors/warnings
+src/Common/AddCDButton/AddCDButton.tsx
+src/Common/AddCDButton/utils.tsx
+src/Common/Api.ts
+src/Common/AppStatus/AppStatus.tsx
+src/Common/AppStatus/index.ts
+src/Common/AppStatus/utils.ts
+src/Common/BreadCrumb/BreadCrumb.tsx
+src/Common/BreadCrumb/BreadcrumbStore.tsx
+src/Common/BreadCrumb/Types.ts
+src/Common/CIPipeline.Types.ts
+src/Common/ChartVersionAndTypeSelector.tsx
+src/Common/Checkbox.tsx
+src/Common/ClipboardButton/ClipboardButton.tsx
+src/Common/ClipboardButton/__tests__/ClipboardButton.test.tsx
+src/Common/Common.service.ts
+src/Common/Constants.ts
+src/Common/CustomInput/CustomInput.tsx
+src/Common/CustomInput/Types.ts
+src/Common/CustomInput/index.ts
+src/Common/CustomTagSelector/PropagateTagInfo.tsx
+src/Common/CustomTagSelector/ResizableTagTextArea.tsx
+src/Common/CustomTagSelector/TagDetails.tsx
+src/Common/CustomTagSelector/TagLabelSelect.tsx
+src/Common/CustomTagSelector/TagLabelValueSelector.tsx
+src/Common/CustomTagSelector/TagSelector.utils.ts
+src/Common/CustomTagSelector/Types.ts
+src/Common/CustomTagSelector/ValidationRules.ts
+src/Common/CustomTagSelector/index.ts
+src/Common/DebouncedSearch/DebouncedSearch.tsx
+src/Common/DebouncedSearch/Utils.ts
+src/Common/DebouncedSearch/__tests__/DebouncedSearch.test.tsx
+src/Common/DeleteComponentModal/DeleteComponent.tsx
+src/Common/DeleteComponentModal/types.ts
+src/Common/DevtronProgressing/DevtronProgressing.tsx
+src/Common/Dialogs/ConfirmationDialog.tsx
+src/Common/Dialogs/DeleteDialog.tsx
+src/Common/Dialogs/DialogForm.tsx
+src/Common/Dialogs/ForceDeleteDialog.tsx
+src/Common/Dialogs/Types.ts
+src/Common/Dialogs/index.ts
+src/Common/DraggableWrapper/DraggableButton.tsx
+src/Common/DraggableWrapper/DraggableWrapper.tsx
+src/Common/Drawer/Drawer.tsx
+src/Common/EmptyState/EmptyState.tsx
+src/Common/EmptyState/GenericEmptyState.tsx
+src/Common/Error.tsx
+src/Common/ErrorScreenNotFound.tsx
+src/Common/Grid/Grid.tsx
+src/Common/Helper.tsx
+src/Common/Hooks/UseClickOutside/UseClickOutside.tsx
+src/Common/Hooks/UseSuperAdmin/UseSuperAdmin.tsx
+src/Common/Hooks/UseWindowSize/UseWindowSize.tsx
+src/Common/ImageTags.Types.ts
+src/Common/ImageTags.tsx
+src/Common/InfoColorBar/InfoColourbar.tsx
+src/Common/Modals/Modal.tsx
+src/Common/Modals/OpaqueModal.tsx
+src/Common/Modals/VisibleModal.tsx
+src/Common/Modals/VisibleModal2.tsx
+src/Common/MultiSelectCustomization.tsx
+src/Common/Policy.Types.ts
+src/Common/PopupMenu.tsx
+src/Common/Progressing.tsx
+src/Common/RJSF/Form.tsx
+src/Common/RJSF/common/FieldRow.tsx
+src/Common/RJSF/config.ts
+src/Common/RJSF/templates/ArrayFieldItemTemplate.tsx
+src/Common/RJSF/templates/ArrayFieldTemplate.tsx
+src/Common/RJSF/templates/BaseInput.tsx
+src/Common/RJSF/templates/ButtonTemplates/AddButton.tsx
+src/Common/RJSF/templates/ButtonTemplates/RemoveButton.tsx
+src/Common/RJSF/templates/ButtonTemplates/SubmitButton.tsx
+src/Common/RJSF/templates/Description.tsx
+src/Common/RJSF/templates/Field.tsx
+src/Common/RJSF/templates/FieldErrorTemplate.tsx
+src/Common/RJSF/templates/ObjectFieldTemplate.tsx
+src/Common/RJSF/templates/TitleField.tsx
+src/Common/RJSF/templates/WrapIfAdditionalTemplate.tsx
+src/Common/RJSF/utils.ts
+src/Common/RJSF/widgets/Checkbox.tsx
+src/Common/RJSF/widgets/Select.tsx
+src/Common/RadioGroup.tsx
+src/Common/RadioGroup/RadioGroup.tsx
+src/Common/Reload.tsx
+src/Common/ResizableTextarea.tsx
+src/Common/Security/ScanVulnerabilitiesTable.tsx
+src/Common/ServerError.ts
+src/Common/TippyCustomized.tsx
+src/Common/ToastBody.tsx
+src/Common/Toggle/Toggle.tsx
+src/Common/Types.ts
+src/custom.d.ts
+src/index.ts

package/.eslintrc.js

@@ -1,41 +1,109 @@
 module.exports = {
     parser: '@typescript-eslint/parser',
-    plugins: ['@typescript-eslint'],
+    plugins: ['@typescript-eslint', 'react', 'prettier'],
     env: {
-        commonjs: true,
         browser: true,
-        es6: true,
+        es2021: true,
     },
     parserOptions: {
-        ecmaVersion: 2018,
+        ecmaVersion: 2021,
         sourceType: 'module',
         ecmaFeatures: {
             jsx: true,
         },
         project: ['./tsconfig.json'],
     },
+    globals: {
+        JSX: true,
+    },
+    extends: [
+        'eslint:recommended',
+        'plugin:react/recommended',
+        'plugin:react/jsx-runtime',
+        'plugin:@typescript-eslint/eslint-recommended',
+        'airbnb',
+        'airbnb/hooks',
+        'prettier',
+    ],
     rules: {
+        'prettier/prettier': ['error'],
+        'linebreak-style': ['error', 'unix'],
+        'no-console': 'warn',
         'no-var': 'error',
         'no-duplicate-imports': 'error',
+        'no-shadow': 'off',
+        '@typescript-eslint/no-shadow': 'warn',
         '@typescript-eslint/explicit-function-return-type': 'off',
-        '@typescript-eslint/no-explicit-any': 'off',
-        '@typescript-eslint/no-use-before-define': 'off',
         '@typescript-eslint/explicit-member-accessibility': 'off',
-        curly: [2, 'all'],
-        'keyword-spacing': 'error',
-        'prettier/prettier': ['error', { semi: false }],
+        // Since we are using typescript, we can disable the no-unused-vars rule for enum,etc
+        'no-unused-vars': 'off',
+        '@typescript-eslint/no-unused-vars': 'error',
+        'react/jsx-filename-extension': [
+            'error',
+            {
+                extensions: ['tsx'],
+            },
+        ],
+        'react/jsx-props-no-spreading': 'off',
+        'react/prefer-stateless-function': 'off',
+        'jsx-a11y/click-events-have-key-events': 'off',
+        'jsx-a11y/no-static-element-interactions': 'off',
+        'jsx-a11y/no-noninteractive-element-interactions': 'off',
+        'no-underscore-dangle': 'off',
+        'import/no-extraneous-dependencies': [
+            'warn',
+            {
+                devDependencies: true,
+            },
+        ],
+        'no-plusplus': [
+            'error',
+            {
+                allowForLoopAfterthoughts: true,
+            },
+        ],
+        // Since we dont use prop-types, we can disable this rule
+        'react/require-default-props': 'off',
+        'react-hooks/exhaustive-deps': 'off',
+        'react/function-component-definition': [
+            'warn',
+            {
+                namedComponents: 'arrow-function',
+                unnamedComponents: 'arrow-function',
+            },
+        ],
+        'react/jsx-uses-react': 'off',
+        'react/react-in-jsx-scope': 'off',
+        // additional rules:
+        '@typescript-eslint/no-floating-promises': 'error',
+        'import/extensions': [
+            'warn',
+            'ignorePackages',
+            {
+                js: 'never',
+                jsx: 'never',
+                ts: 'never',
+                tsx: 'never',
+            },
+        ],
     },
-    extends: [
-        'eslint:recommended',
-        'plugin:@typescript-eslint/eslint-recommended',
-        'plugin:@typescript-eslint/recommended',
-        'prettier/@typescript-eslint',
-        'plugin:prettier/recommended',
-        'plugin:react/recommended',
+    overrides: [
+        {
+            files: ['*.ts', '*.tsx'],
+            rules: {
+                'no-undef': 'off',
+            },
+        },
     ],
     settings: {
         react: {
             version: 'detect',
         },
+        'import/resolver': {
+            node: {
+                moduleDirectory: ['src', 'node_modules'],
+                extensions: ['.js', '.jsx', '.ts', '.tsx'],
+            },
+        },
     },
 }

package/.github/pull_request_template.md

@@ -0,0 +1,25 @@
+# Description
+
+Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.
+
+## Type of change
+
+- [ ] Bug fix (non-breaking change which fixes an issue)
+- [ ] New feature (non-breaking change which adds functionality)
+- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
+- [ ] This change requires a documentation update
+
+## How Has This Been Tested?
+
+Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration
+
+- [ ] Test A
+- [ ] Test B
+
+## Checklist
+
+- [ ] The title of the PR states what changed and the related issues number (used for the release note).
+- [ ] Does this PR require documentation updates?
+- [ ] I've updated documentation as required by this PR.
+- [ ] I have performed a self-review of my own code
+- [ ] I have commented my code, particularly in hard-to-understand areas

package/.github/workflows/ci.yml

@@ -0,0 +1,31 @@
+name: Common Lib CI
+
+on:
+  pull_request:
+    types:
+      - opened
+      - synchronize
+      - edited
+      - reopened
+
+jobs:
+  ci:
+    runs-on: ubuntu-latest
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v3
+
+    - name: Use Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version-file: '.nvmrc'
+        cache: 'npm'
+
+    - name: Install dependencies
+      run: npm ci
+
+    - name: Check linting issues
+      run: npm run lint
+
+    - name: Build Lib
+      run: npm run build-lib

package/.github/workflows/release-package.yml

@@ -11,7 +11,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version-file: '.nvmrc'
       - run: npm ci
       - run: npm test
 
@@ -25,7 +25,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version-file: '.nvmrc'
           registry-url: https://npm.pkg.github.com/
       - run: npm ci
       - run: npm run build-lib
@@ -46,4 +46,3 @@ jobs:
       - run: npm publish --access public
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
-

package/.husky/pre-commit

@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx tsc --noEmit
+npm run lint-staged

package/.lintstagedrc

@@ -0,0 +1,3 @@
+{
+    "*.{js,jsx,ts,tsx}": ["npx eslint"]
+}

package/.nvmrc

@@ -0,0 +1 @@
+v16.13.0

package/dist/Common/DebouncedSearch/DebouncedSearch.d.ts

@@ -1,6 +1,8 @@
 /// <reference types="react" />
 import { DebouncedSearchProps } from './Types';
 /**
+ * @deprecated Use `SearchBar` component instead.
+ *
  * @param onSearch - Callback function to be called on search
  * @param Icon - (Optional) Icon to be shown before the input
  * @param iconClass - (Optional) Class for the icon

package/dist/Common/Helper.d.ts

@@ -57,4 +57,8 @@ export declare const customStyles: {
 export declare const getFilteredChartVersions: (charts: any, selectedChartType: any) => any;
 export declare function getUnlockedJSON(json: any, jsonPathArray: any): any;
 export declare function getLockedJSON(json: any, jsonPathArray: string[]): any;
+/**
+ * Returns a debounced variant of the function
+ */
+export declare const debounce: (func: any, timeout?: number) => (this: any, ...args: any[]) => void;
 export {};

package/dist/Common/SearchBar/SearchBar.component.d.ts

@@ -0,0 +1,8 @@
+import { FunctionComponent } from 'react';
+import { SearchBarProps } from './types';
+import './searchBar.scss';
+/**
+ * Generic search input component with support for enter based and debounced search
+ */
+declare const SearchBar: FunctionComponent<SearchBarProps>;
+export default SearchBar;

package/dist/Common/SearchBar/types.d.ts

@@ -0,0 +1,35 @@
+import { InputHTMLAttributes, SyntheticEvent } from 'react';
+export interface SearchBarProps {
+    /**
+     * Initial search text
+     *
+     * @default ''
+     */
+    initialSearchText?: string;
+    /**
+     * Search handler for the search input
+     */
+    handleSearchChange?: (searchText: string) => void;
+    /**
+     * Enter event handler for the search input
+     */
+    handleEnter?: (event: SyntheticEvent) => void;
+    /**
+     * Input props for the search input
+     */
+    inputProps?: InputHTMLAttributes<HTMLInputElement>;
+    /**
+     * Class name for the container; can be used for handling width
+     */
+    containerClassName?: string;
+    /**
+     * If true, the change handler would be triggered with debounce
+     *
+     * @default false
+     */
+    shouldDebounce?: boolean;
+    /**
+     * Timeout for the debounce handler to be triggered
+     */
+    debounceTimeout?: number;
+}

package/dist/Common/index.d.ts

@@ -26,6 +26,7 @@ export * from './Common.service';
 export * from './Checkbox';
 export { default as EmptyState } from './EmptyState/EmptyState';
 export { default as GenericEmptyState } from './EmptyState/GenericEmptyState';
+export { default as SearchBar } from './SearchBar/SearchBar.component';
 export { default as Toggle } from './Toggle/Toggle';
 export { default as ScanVulnerabilitiesTable } from './Security/ScanVulnerabilitiesTable';
 export { default as StyledRadioGroup } from './RadioGroup/RadioGroup';