@devtron-labs/devtron-fe-common-lib 1.4.0-beta-6 → 1.4.0-beta-7

package/dist/Common/CodeEditor/CodeEditor.reducer.d.ts

@@ -1,48 +1,36 @@
 import { MODES } from '../Constants';
-import { Action, CodeEditorInitialValueType, CodeEditorState, CodeEditorThemesKeys } from './types';
+import { Action, CodeEditorInitialValueType, CodeEditorState } from './types';
 export declare const CodeEditorReducer: (state: CodeEditorState, action: Action) => {
     mode: any;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
-    defaultCode: string;
     noParsing: boolean;
 } | {
     diffMode: any;
     mode: MODES;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
-    defaultCode: string;
     noParsing: boolean;
 } | {
     theme: any;
     mode: MODES;
     diffMode: boolean;
     code: string;
-    defaultCode: string;
     noParsing: boolean;
 } | {
     code: any;
     mode: MODES;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
-    defaultCode: string;
-    noParsing: boolean;
-} | {
-    defaultCode: any;
-    mode: MODES;
-    diffMode: boolean;
-    theme: CodeEditorThemesKeys;
-    code: string;
+    theme: import('./types').CodeEditorThemesKeys;
     noParsing: boolean;
 } | {
     height: any;
     mode: MODES;
     diffMode: boolean;
-    theme: CodeEditorThemesKeys;
+    theme: import('./types').CodeEditorThemesKeys;
     code: string;
-    defaultCode: string;
     noParsing: boolean;
 };
 export declare const parseValueToCode: (value: string, mode: string, tabSize: number) => string;
-export declare const initialState: ({ mode, theme, value, defaultValue, diffView, noParsing, tabSize, }: CodeEditorInitialValueType) => CodeEditorState;
+export declare const initialState: ({ mode, theme, value, diffView, noParsing, tabSize, appTheme, }: CodeEditorInitialValueType) => CodeEditorState;

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

@@ -1,14 +1,20 @@
+import { AppThemeType } from '../../Shared/Providers';
 import { MODES } from '../Constants';
 export interface InformationBarProps {
     text: string;
     className?: string;
     children?: React.ReactNode;
 }
+export declare enum CodeEditorThemesKeys {
+    vsDarkDT = "vs-dark--dt",
+    vs = "vs",
+    networkStatusInterface = "network-status-interface"
+}
 interface CodeEditorBaseInterface {
     value?: string;
     lineDecorationsWidth?: number;
     responseType?: string;
-    onChange?: (value: string, defaultValue: string) => void;
+    onChange?: (string: any) => void;
     onBlur?: () => void;
     onFocus?: () => void;
     children?: any;
@@ -22,7 +28,7 @@ interface CodeEditorBaseInterface {
     diffView?: boolean;
     loading?: boolean;
     customLoader?: JSX.Element;
-    theme?: string;
+    theme?: CodeEditorThemesKeys;
     original?: string;
     focus?: boolean;
     validatorSchema?: any;
@@ -63,33 +69,24 @@ export interface CodeEditorHeaderComposition {
     ValidationError?: React.FC<any>;
     Clipboard?: React.FC<any>;
 }
-export type ActionTypes = 'changeLanguage' | 'setDiff' | 'setTheme' | 'setCode' | 'setDefaultCode' | 'setHeight';
+export type ActionTypes = 'changeLanguage' | 'setDiff' | 'setTheme' | 'setCode' | 'setHeight';
 export interface Action {
     type: ActionTypes;
     value: any;
 }
-export declare enum CodeEditorThemesKeys {
-    vsDarkDT = "vs-dark--dt",
-    deleteDraft = "delete-draft",
-    unpublished = "unpublished",
-    vs = "vs",
-    networkStatusInterface = "network-status-interface"
-}
-export interface CodeEditorInitialValueType {
+export interface CodeEditorInitialValueType extends Pick<CodeEditorBaseInterface, 'theme'> {
     mode: string;
     diffView: boolean;
-    theme?: string;
     value: string;
-    defaultValue: string;
     noParsing?: boolean;
     tabSize: number;
+    appTheme: AppThemeType;
 }
 export interface CodeEditorState {
     mode: MODES;
     diffMode: boolean;
     theme: CodeEditorThemesKeys;
     code: string;
-    defaultCode: string;
     noParsing: boolean;
 }
 export declare enum CodeEditorActionTypes {

package/dist/Common/CodeEditor/utils.d.ts

@@ -0,0 +1,3 @@
+import { AppThemeType } from '../../Shared/Providers';
+import { CodeEditorInterface } from './types';
+export declare const getCodeEditorThemeFromAppTheme: (editorTheme: CodeEditorInterface["theme"], appTheme: AppThemeType) => CodeEditorInterface["theme"];

package/dist/Common/Constants.d.ts

@@ -95,7 +95,6 @@ export declare const ROUTES: {
     ATTRIBUTES_UPDATE: string;
     APP_LIST_MIN: string;
     CLUSTER_LIST_MIN: string;
-    CLUSTER_LIST_RAW: string;
     PLUGIN_GLOBAL_LIST_DETAIL_V2: string;
     PLUGIN_GLOBAL_LIST_V2: string;
     PLUGIN_GLOBAL_LIST_TAGS: string;

package/dist/Common/MultiSelectCustomization.d.ts

@@ -23,6 +23,8 @@ export declare const multiSelectStyles: {
     option: (base: any, state: any) => any;
     container: (base: any, state: any) => any;
     valueContainer: (base: any, state: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
 };
 export interface CustomSelect {
     sortSelected?: boolean;

package/dist/Common/RJSF/utils.d.ts

@@ -13,6 +13,9 @@ export declare const getCommonSelectStyle: (styleOverrides?: {}) => {
     loadingMessage: (base: any) => any;
     noOptionsMessage: (base: any) => any;
     multiValue: (base: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
+    menu: (base: any) => any;
 };
 /**
  * Returns the redirection props for a url

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

@@ -1,3 +1,3 @@
 import { SegmentedControlProps } from './types';
-declare const SegmentedControl: ({ tabs, initialTab, onChange, tooltips, disabled, rootClassName, name, variant, }: SegmentedControlProps) => JSX.Element;
+declare const SegmentedControl: ({ tabs, initialTab, onChange, tooltips, disabled, rootClassName, name, variant, size, }: SegmentedControlProps) => JSX.Element;
 export default SegmentedControl;

package/dist/Common/SegmentedControl/constants.d.ts

@@ -0,0 +1,2 @@
+import { SegmentedControlProps } from './types';
+export declare const SEGMENTED_CONTROL_SIZE_TO_CLASS_MAP: Record<SegmentedControlProps['size'], string>;

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

@@ -1,10 +1,12 @@
 import { OptionType } from '../Types';
+import { ComponentSizeType } from '../../Shared/constants';
+import { ReactNode } from 'react';
 export declare enum SegmentedControlVariant {
     GRAY_ON_WHITE = "gui-yaml-switch",
     WHITE_ON_GRAY = "gui-yaml-switch-window-bg"
 }
 export interface SegmentedControlProps {
-    tabs: OptionType[];
+    tabs: OptionType<string, ReactNode>[];
     initialTab: string;
     onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     name: string;
@@ -12,4 +14,8 @@ export interface SegmentedControlProps {
     disabled?: boolean;
     rootClassName?: string;
     variant?: SegmentedControlVariant;
+    /**
+     * @default ComponentSizeType.medium
+     */
+    size?: ComponentSizeType.medium | ComponentSizeType.large;
 }

package/dist/Pages/ResourceBrowser/service.d.ts

@@ -1,6 +1,4 @@
 import { ResponseType } from '../../Common/Types';
 import { CreateResourceDTO, CreateResourcePayload, K8sResourceDetailType, K8sResourceListPayloadType } from './ResourceBrowser.Types';
-import { ClusterDetail } from './types';
 export declare const getK8sResourceList: (resourceListPayload: K8sResourceListPayloadType, signal?: AbortSignal) => Promise<ResponseType<K8sResourceDetailType>>;
 export declare const createNewResource: (resourceListPayload: CreateResourcePayload) => Promise<ResponseType<CreateResourceDTO[]>>;
-export declare const getClusterListRaw: () => Promise<ResponseType<ClusterDetail[]>>;

package/dist/Shared/Components/CICDHistory/DeploymentHistoryConfigDiff/DeploymentHistoryDiffView.d.ts

@@ -1,3 +1,3 @@
 import { DeploymentTemplateHistoryType } from '../types';
-declare const DeploymentHistoryDiffView: ({ currentConfiguration, baseTemplateConfiguration, previousConfigAvailable, isUnpublished, isDeleteDraft, rootClassName, sortingConfig, codeEditorKey, }: DeploymentTemplateHistoryType) => JSX.Element;
+declare const DeploymentHistoryDiffView: ({ currentConfiguration, baseTemplateConfiguration, previousConfigAvailable, rootClassName, sortingConfig, codeEditorKey, }: DeploymentTemplateHistoryType) => JSX.Element;
 export default DeploymentHistoryDiffView;

package/dist/Shared/Components/CICDHistory/constants.d.ts

@@ -11,6 +11,8 @@ export declare const FILTER_STYLE: {
     option: (base: any, state: any) => any;
     container: (base: any, state: any) => any;
     valueContainer: (base: any, state: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
 };
 export declare const GIT_BRANCH_NOT_CONFIGURED = "Not Configured";
 export declare const DEFAULT_GIT_BRANCH_VALUE = "--";

package/dist/Shared/Components/CICDHistory/types.d.ts

@@ -390,8 +390,6 @@ export interface DeploymentTemplateHistoryType {
     currentConfiguration: DeploymentHistoryDetail;
     baseTemplateConfiguration: DeploymentHistoryDetail;
     previousConfigAvailable: boolean;
-    isUnpublished?: boolean;
-    isDeleteDraft?: boolean;
     rootClassName?: string;
     codeEditorKey?: React.Key;
     sortingConfig?: {

package/dist/Shared/Components/Plugin/PluginTagSelect.d.ts

@@ -1,3 +1,3 @@
 import { PluginTagSelectProps } from './types';
-declare const PluginTagSelect: ({ availableTags, handleUpdateSelectedTags, selectedTags, isLoading, hasError, reloadTags, }: PluginTagSelectProps) => JSX.Element;
+declare const PluginTagSelect: ({ availableTags, handleUpdateSelectedTags, selectedTags, isLoading, tagsError, reloadTags, }: PluginTagSelectProps) => JSX.Element;
 export default PluginTagSelect;

package/dist/Shared/Components/Plugin/types.d.ts

@@ -1,5 +1,5 @@
 import { MutableRefObject } from 'react';
-import { ConsequenceType, VariableType } from '../../../Common';
+import { ConsequenceType, ServerErrors, VariableType } from '../../../Common';
 import { BaseFilterQueryParams } from '../../types';
 import { ImageWithFallbackProps } from '../ImageWithFallback';
 import { getPluginStoreData } from './service';
@@ -149,7 +149,7 @@ export interface PluginListParamsType {
 export interface PluginTagSelectProps extends Pick<BasePluginListContainerProps, 'availableTags'> {
     selectedTags: PluginListContainerProps['parentFilters']['selectedTags'];
     isLoading: boolean;
-    hasError: boolean;
+    tagsError: ServerErrors;
     reloadTags: () => void;
     handleUpdateSelectedTags: (tags: string[]) => void;
 }

package/dist/Shared/Components/Plugin/utils.d.ts

@@ -1,21 +1,5 @@
-import { OptionProps } from 'react-select';
-import { OptionType } from '../../../Common/Types';
 import { ParentPluginDTO, PluginDataStoreType } from './types';
 export declare const parsePluginDetailsDTOIntoPluginStore: (pluginData: ParentPluginDTO[]) => PluginDataStoreType;
-export declare const pluginTagSelectStyles: {
-    option: (base: any, state: any) => any;
-    container: (base: any, state: any) => any;
-    menuList: (base: any) => any;
-    control: (base: any, state: any) => any;
-    dropdownIndicator: (base: any, state: any) => any;
-    valueContainer: (base: any) => any;
-    loadingMessage: (base: any) => any;
-    noOptionsMessage: (base: any) => any;
-    placeholder: (base: any) => any;
-    group: (base: any) => any;
-    groupHeading: (base: any) => any;
-};
-export declare const PluginTagOption: (props: OptionProps<OptionType, true>) => JSX.Element;
 /**
  * @description This method takes the initial plugin data store and updates the keys with the target parent plugin store and plugin version store
  */

package/dist/Shared/Components/ReactSelect/constants.d.ts

@@ -11,4 +11,5 @@ export declare const CommonGroupedDropdownStyles: {
     multiValue: (base: any) => any;
     multiValueLabel: (base: any) => any;
     placeholder: (base: any) => any;
+    menu: (base: any) => any;
 };

package/dist/Shared/Components/ReactSelect/utils.d.ts

@@ -12,6 +12,9 @@ export declare const getCommonSelectStyle: (styleOverrides?: {}) => {
     placeholder: (base: any) => any;
     group: (base: any) => any;
     groupHeading: (base: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
+    menu: (base: any) => any;
 };
 export declare const getCustomOptionSelectionStyle: (styleOverrides?: {}) => (base: any, state: any) => any;
 export declare const SelectOption: (props: any) => JSX.Element;
@@ -29,6 +32,9 @@ export declare const commonSelectStyles: {
     placeholder: (base: any) => any;
     group: (base: any) => any;
     groupHeading: (base: any) => any;
+    singleValue: (base: any) => any;
+    input: (base: any) => any;
+    menu: (base: any) => any;
 };
 export declare const MenuListWithApplyButton: ({ handleApplyFilter, ...props }: MenuListProps & {
     handleApplyFilter: () => void;

package/dist/Shared/Components/Security/SecurityModal/constants.d.ts

@@ -14,35 +14,35 @@ export declare const SUB_CATEGORY_LABELS: {
 export declare const SEVERITIES: {
     readonly critical: {
         readonly label: "Critical";
-        readonly color: "#B21212";
+        readonly color: "var(--R700)";
     };
     readonly high: {
         readonly label: "High";
-        readonly color: "#F33E3E";
+        readonly color: "var(--R500)";
     };
     readonly medium: {
         readonly label: "Medium";
-        readonly color: "#FF7E5B";
+        readonly color: "var(--O500)";
     };
     readonly low: {
         readonly label: "Low";
-        readonly color: "#FFB549";
+        readonly color: "var(--Y500)";
     };
     readonly unknown: {
         readonly label: "Unknown";
-        readonly color: "#B1B7BC";
+        readonly color: "var(--N300)";
     };
     readonly fail: {
         readonly label: "Failures";
-        readonly color: "#F33E3E";
+        readonly color: "var(--R500)";
     };
     readonly success: {
         readonly label: "Successes";
-        readonly color: "#1DAD70";
+        readonly color: "var(--G500)";
     };
     readonly exceptions: {
         readonly label: "Exceptions";
-        readonly color: "#B1B7BC";
+        readonly color: "var(--N300)";
     };
 };
 export declare const ORDERED_SEVERITY_KEYS: readonly [SeveritiesDTO.CRITICAL, SeveritiesDTO.HIGH, SeveritiesDTO.MEDIUM, SeveritiesDTO.LOW, SeveritiesDTO.UNKNOWN, SeveritiesDTO.FAILURES, SeveritiesDTO.EXCEPTIONS, SeveritiesDTO.SUCCESSES];

package/dist/Shared/Components/Security/SecurityModal/utils.d.ts

@@ -1,7 +1,7 @@
 import { ScanResultDTO, SeveritiesDTO, GetResourceScanDetailsResponseType, ImageScanVulnerabilityType, ImageVulnerabilityType, VulnerabilityCountType } from './types';
 import { SEVERITIES } from './constants';
 export declare const mapSeveritiesToSegmentedBarChartEntities: (severities: Partial<Record<keyof typeof SEVERITIES, number>>) => {
-    color: "#B1B7BC" | "#B21212" | "#F33E3E" | "#FF7E5B" | "#FFB549" | "#1DAD70";
+    color: "var(--Y500)" | "var(--R500)" | "var(--G500)" | "var(--O500)" | "var(--N300)" | "var(--R700)";
     label: "Critical" | "High" | "Medium" | "Low" | "Unknown" | "Failures" | "Successes" | "Exceptions";
     value: number;
 }[];

package/dist/Shared/Components/SelectPicker/SelectPicker.component.d.ts

@@ -43,7 +43,7 @@ import { SelectPickerProps } from './type';
  * <SelectPicker
  *      ...
  *      renderMenuListFooter={() => (
- *          <div className="px-8 py-6 dc__border-top bcn-50 cn-6">
+ *          <div className="px-8 py-6 dc__border-top bg__secondary cn-6">
  *              <div>Foot note</div>
  *          </div>
  *      )}

package/dist/Shared/Components/ThemeSwitcher/ThemeSwitcher.component.d.ts

@@ -0,0 +1,3 @@
+import { ThemeSwitcherProps } from './types';
+declare const ThemeSwitcher: ({ onChange }: ThemeSwitcherProps) => JSX.Element;
+export default ThemeSwitcher;

package/dist/Shared/Components/ThemeSwitcher/constants.d.ts

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { ThemePreferenceType } from '@Shared/Providers/ThemeProvider/types';
+export declare const THEME_PREFERENCE_TO_ICON_MAP: Record<ThemePreferenceType, {
+    tippyContent: string;
+    icon: ReactElement;
+}>;

package/dist/Shared/Components/ThemeSwitcher/index.d.ts

@@ -0,0 +1 @@
+export { default as ThemeSwitcher } from './ThemeSwitcher.component';

package/dist/Shared/Components/ThemeSwitcher/types.d.ts

@@ -0,0 +1,3 @@
+export interface ThemeSwitcherProps {
+    onChange: () => void;
+}

package/dist/Shared/Components/index.d.ts

@@ -49,4 +49,3 @@ export * from './DynamicDataTable';
 export * from './TagsKeyValueTable';
 export * from './FileUpload';
 export * from './AnimatedDeployButton';
-export * from './VirtualizedList';

package/dist/Shared/Hooks/useGetResourceKindsOptions/types.d.ts

@@ -17,7 +17,6 @@ export interface ClusterDTO {
     id: number;
     cluster_name: string;
     isVirtualCluster: boolean;
-    isProd: boolean;
 }
 export interface UseGetResourceKindsOptionsProps {
     resourcesToFetch: Extract<ResourceKindType, ResourceKindType.devtronApplication | ResourceKindType.project | ResourceKindType.cluster | ResourceKindType.environment>[];

package/dist/Shared/Providers/ThemeProvider/ThemeProvider.d.ts

@@ -0,0 +1,3 @@
+import { ThemeContextType, ThemeProviderProps } from './types';
+export declare const ThemeProvider: ({ children }: ThemeProviderProps) => JSX.Element;
+export declare const useTheme: () => ThemeContextType;

package/dist/Shared/Providers/ThemeProvider/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const THEME_PREFERENCE_STORAGE_KEY = "selected-theme";
+export declare const DARK_COLOR_SCHEME_MATCH_QUERY = "(prefers-color-scheme: dark)";

package/dist/Shared/Providers/ThemeProvider/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ThemeProvider';
+export { AppThemeType } from './types';

package/dist/Shared/Providers/ThemeProvider/types.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from 'react';
+export declare enum AppThemeType {
+    light = "light",
+    dark = "dark"
+}
+export declare const THEME_PREFERENCE_MAP: {
+    readonly auto: "auto";
+    readonly light: AppThemeType.light;
+    readonly dark: AppThemeType.dark;
+};
+export type ThemePreferenceType = (typeof THEME_PREFERENCE_MAP)[keyof typeof THEME_PREFERENCE_MAP];
+export interface ThemeConfigType {
+    /**
+     * Current application theme
+     *
+     * @default AppThemeType.light
+     */
+    appTheme: AppThemeType;
+    /**
+     * Preferred theme for the user (if any)
+     *
+     * @default THEME_PREFERENCE_MAP.auto
+     *
+     * Note: This shouldn't be consumed other than in ThemeSwitcher component
+     */
+    themePreference: ThemePreferenceType;
+}
+export interface ThemeContextType extends ThemeConfigType {
+    handleSelectedThemeChange: (updatedThemePreference: ThemePreferenceType) => void;
+}
+export interface ThemeProviderProps {
+    children: ReactNode;
+}

package/dist/Shared/Providers/ThemeProvider/utils.d.ts

@@ -0,0 +1,4 @@
+import { AppThemeType, ThemePreferenceType, ThemeConfigType } from './types';
+export declare const getAppThemeForAutoPreference: () => AppThemeType;
+export declare const getThemeConfigFromLocalStorage: () => ThemeConfigType;
+export declare const setThemePreferenceInLocalStorage: (themePreference: ThemePreferenceType) => void;

package/dist/Shared/Providers/index.d.ts

@@ -1,4 +1,5 @@
 export * from './MainContextProvider';
 export * from './ImageSelectionUtility';
+export * from './ThemeProvider';
 export * from './UserEmailProvider';
 export type { MainContext } from './types';

package/dist/Shared/Services/types.d.ts

@@ -7,10 +7,6 @@ export interface ClusterType {
      * If true, denotes virtual cluster
      */
     isVirtual: boolean;
-    /**
-     * If true, denotes prod labelled cluster
-     */
-    isProd: boolean;
 }
 /**
  * T => Type of query params