refactor: remove overriddenTheme prop from ConfirmationModal and update theme preference storage key

Author: AbhishekA1509

src/Shared/Components/ConfirmationModal/ConfirmationModal.tsx

@@ -19,7 +19,6 @@ import { AnimatePresence, motion } from 'framer-motion'
 import { noop, stopPropagation, useRegisterShortcut, UseRegisterShortcutProvider } from '@Common/index'
 import { ComponentSizeType } from '@Shared/constants'
 import { getUniqueId } from '@Shared/Helpers'
-import { getComponentSpecificThemeClass } from '@Shared/index'
 import { ConfirmationModalBodyProps, ConfirmationModalProps, ConfirmationModalVariantType } from './types'
 import { getPrimaryButtonStyleFromVariant, getConfirmationLabel, getIconFromVariant } from './utils'
 import { Button, ButtonStyleType, ButtonVariantType } from '../Button'
@@ -38,7 +37,6 @@ const ConfirmationModalBody = ({
     children,
     handleClose,
     shouldCloseOnEscape = true,
-    overriddenTheme,
     isLandscapeView = false,
 }: ConfirmationModalBodyProps) => {
     const { registerShortcut, unregisterShortcut } = useRegisterShortcut()
@@ -84,7 +82,7 @@ const ConfirmationModalBody = ({
     return (
         <Backdrop onEscape={shouldCloseOnEscape ? handleCloseWrapper : noop}>
             <motion.div
-                className={`${overriddenTheme ? getComponentSpecificThemeClass(overriddenTheme) : ''} ${isLandscapeView ? 'w-500' : 'w-400'} confirmation-modal border__secondary flexbox-col br-8 bg__primary dc__m-auto mt-40 w-400`}
+                className={`${isLandscapeView ? 'w-500' : 'w-400'} confirmation-modal border__secondary flexbox-col br-8 bg__primary dc__m-auto mt-40 w-400`}
                 exit={{ y: 100, opacity: 0, scale: 0.75, transition: { duration: 0.35 } }}
                 initial={{ y: 100, opacity: 0, scale: 0.75 }}
                 animate={{ y: 0, opacity: 1, scale: 1 }}

src/Shared/Components/ConfirmationModal/types.ts

@@ -23,7 +23,6 @@ import {
     SetStateAction,
     SyntheticEvent,
 } from 'react'
-import { AppThemeType } from '@Shared/index'
 import { ButtonProps } from '../Button'
 
 export enum ConfirmationModalVariantType {
@@ -95,10 +94,6 @@ export type ConfirmationModalProps<isConfig extends boolean = false> = PropsWith
      * Configuration object for confirmation behavior.
      */
     confirmationConfig?: ConfirmationConfigType
-    /**
-     * If provided, the modal will use the specified theme instead of using the theme set by theme provider.
-     */
-    overriddenTheme?: AppThemeType
     /**
      * @default false
      * @deprecated Used to extend the width to 500px and remove gap between title and subTitle.

src/Shared/Providers/ThemeProvider/constants.ts

@@ -14,6 +14,6 @@
  * limitations under the License.
  */
 
-export const THEME_PREFERENCE_STORAGE_KEY = 'themePreference'
+export const THEME_PREFERENCE_STORAGE_KEY = 'themePreference__v1'
 
 export const DARK_COLOR_SCHEME_MATCH_QUERY = '(prefers-color-scheme: dark)'

src/Shared/Providers/ThemeProvider/index.ts

@@ -16,4 +16,4 @@
 
 export * from './ThemeProvider'
 export { AppThemeType } from './types'
-export { getComponentSpecificThemeClass, getAppThemeForAutoPreference, getThemePreferenceText } from './utils'
+export { getComponentSpecificThemeClass, getThemePreferenceText } from './utils'