From 4528710ff214dcc1f33576c06356f99d9bc6eba9 Mon Sep 17 00:00:00 2001 From: Amit Amrutiya Date: Thu, 23 Jan 2025 23:06:52 +0530 Subject: [PATCH 1/3] fix: issue with the prompt component Signed-off-by: Amit Amrutiya --- src/custom/Prompt/index.tsx | 4 ++-- src/custom/Prompt/promt-component.tsx | 8 +++++++- src/custom/index.tsx | 3 ++- 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/custom/Prompt/index.tsx b/src/custom/Prompt/index.tsx index 2a3497faf..46a7b6a75 100644 --- a/src/custom/Prompt/index.tsx +++ b/src/custom/Prompt/index.tsx @@ -1,3 +1,3 @@ -import PromptComponent from './promt-component'; - +import PromptComponent, { PROMPT_VARIANTS } from './promt-component'; +export { PROMPT_VARIANTS, PromptComponent }; export default PromptComponent; diff --git a/src/custom/Prompt/promt-component.tsx b/src/custom/Prompt/promt-component.tsx index 90824d958..052bac06e 100644 --- a/src/custom/Prompt/promt-component.tsx +++ b/src/custom/Prompt/promt-component.tsx @@ -96,7 +96,13 @@ const PromptComponent = forwardRef(({ variant }, ref) => {subtitle && ( - + {subtitle} diff --git a/src/custom/index.tsx b/src/custom/index.tsx index 2a4e5e93b..b95c87904 100644 --- a/src/custom/index.tsx +++ b/src/custom/index.tsx @@ -36,7 +36,7 @@ import { LearningCard } from './LearningCard'; import { BasicMarkdown, RenderMarkdown } from './Markdown'; import { ModalCard } from './ModalCard'; import PopperListener, { IPopperListener } from './PopperListener'; -import PromptComponent from './Prompt'; +import { PROMPT_VARIANTS, PromptComponent } from './Prompt'; import ResponsiveDataTable, { DataTableEllipsisMenu, ResponsiveDataTableProps @@ -90,6 +90,7 @@ export { InfoTooltip, LearningCard, ModalCard, + PROMPT_VARIANTS, PopperListener, PromptComponent, ResponsiveDataTable, From 12967c4c97fed29a2c424444e5b5ca19080b48a8 Mon Sep 17 00:00:00 2001 From: Amit Amrutiya Date: Thu, 23 Jan 2025 23:44:17 +0530 Subject: [PATCH 2/3] feat: add checkbox option in the prompt component Signed-off-by: Amit Amrutiya --- src/custom/Prompt/promt-component.tsx | 38 +++++++++++++++++++++++---- 1 file changed, 33 insertions(+), 5 deletions(-) diff --git a/src/custom/Prompt/promt-component.tsx b/src/custom/Prompt/promt-component.tsx index 052bac06e..9dbecaf52 100644 --- a/src/custom/Prompt/promt-component.tsx +++ b/src/custom/Prompt/promt-component.tsx @@ -1,5 +1,5 @@ import { forwardRef, useImperativeHandle, useRef, useState } from 'react'; -import { Typography } from '../../base'; +import { Checkbox, FormControlLabel, Typography } from '../../base'; import { useTheme } from '../../theme'; import { Modal, ModalBody, ModalButtonPrimary, ModalButtonSecondary, ModalFooter } from '../Modal'; import { ActionComponent, Subtitle } from './style'; @@ -26,6 +26,8 @@ interface State { showInfoIcon?: string; variant?: PromptVariant; headerIcon?: React.ReactNode; + showCheckbox?: boolean; + isChecked?: boolean; } interface ShowParams { @@ -34,11 +36,13 @@ interface ShowParams { primaryOption: string; variant: PromptVariant; showInfoIcon?: string; + showCheckbox?: boolean; headerIcon?: React.ReactNode; } export interface PromptRef { show: (params: ShowParams) => Promise; + getCheckboxState: () => boolean; } const PromptComponent = forwardRef(({ variant }, ref) => { @@ -49,7 +53,9 @@ const PromptComponent = forwardRef(({ variant }, ref) => primaryOption: '', showInfoIcon: '', variant, - headerIcon: undefined + headerIcon: undefined, + isChecked: false, + showCheckbox: false }); /* This ref is used to store the resolve and reject functions of the promise returned by the show method */ @@ -67,7 +73,8 @@ const PromptComponent = forwardRef(({ variant }, ref) => setState({ ...params, isOpen: true, - showInfoIcon: params.showInfoIcon || '' + showInfoIcon: params.showInfoIcon || '', + showCheckbox: !!params.showCheckbox }); }); }; @@ -77,11 +84,20 @@ const PromptComponent = forwardRef(({ variant }, ref) => setState((prevState) => ({ ...prevState, isOpen: false })); }; + const handleCheckboxChange = () => { + setState((prevState) => ({ ...prevState, isChecked: !prevState.isChecked })); + }; + + const getCheckboxState = () => { + return !!state.isChecked; + }; + useImperativeHandle(ref, () => ({ - show + show, + getCheckboxState })); - const { isOpen, primaryOption, title, subtitle, showInfoIcon, headerIcon } = state; + const { isOpen, primaryOption, title, subtitle, showInfoIcon, headerIcon, showCheckbox } = state; const { resolve } = promiseInfoRef.current; return ( @@ -106,6 +122,18 @@ const PromptComponent = forwardRef(({ variant }, ref) => {subtitle} + {showCheckbox && ( + + } + label={Do not show again} + /> + )} )} From c724e7192a707c790993f03408f7409746d8e8da Mon Sep 17 00:00:00 2001 From: Amit Amrutiya Date: Fri, 24 Jan 2025 20:04:26 +0530 Subject: [PATCH 3/3] feat: add pagination item component to sistent Signed-off-by: Amit Amrutiya --- src/base/Pagination/Pagination.tsx | 7 ++++++- src/base/Pagination/index.tsx | 4 ++-- src/theme/palette.ts | 2 +- 3 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/base/Pagination/Pagination.tsx b/src/base/Pagination/Pagination.tsx index 728ad7fee..85526ceb9 100644 --- a/src/base/Pagination/Pagination.tsx +++ b/src/base/Pagination/Pagination.tsx @@ -1,8 +1,13 @@ -import { Pagination as MuiPagination, PaginationProps as MuiPaginationProps } from '@mui/material'; +import { + Pagination as MuiPagination, + PaginationItem as MuiPaginationItem, + PaginationProps as MuiPaginationProps +} from '@mui/material'; import React from 'react'; const Pagination = React.forwardRef((props, ref) => { return ; }); +export { MuiPaginationItem as PaginationItem }; export default Pagination; diff --git a/src/base/Pagination/index.tsx b/src/base/Pagination/index.tsx index 1ab1d4c17..cf0100cf7 100644 --- a/src/base/Pagination/index.tsx +++ b/src/base/Pagination/index.tsx @@ -1,5 +1,5 @@ import { PaginationProps } from '@mui/material'; -import Pagination from './Pagination'; +import Pagination, { PaginationItem } from './Pagination'; -export { Pagination }; +export { Pagination, PaginationItem }; export type { PaginationProps }; diff --git a/src/theme/palette.ts b/src/theme/palette.ts index a8dda89f0..3881c6714 100644 --- a/src/theme/palette.ts +++ b/src/theme/palette.ts @@ -350,7 +350,7 @@ export const darkModePalette: PaletteOptions = { tertiary: Colors.blue[10] }, success: { - default: Colors.green[40], + default: Colors.KEPPEL, hover: Colors.green[50], pressed: Colors.green[60], secondary: Colors.green[20],