From 9fdea5867c0a75e0faee3be1c97e417e60aad197 Mon Sep 17 00:00:00 2001 From: Natalia Venditto Date: Mon, 11 Dec 2023 14:39:19 +0100 Subject: [PATCH] feat: change items to compliant name. Closes #163 --- .../src/components/chat-history-controller.ts | 2 +- .../SettingsStyles/SettingsStyles.tsx | 6 +++--- .../components/ThemeSwitch/ThemeSwitch.tsx | 2 +- packages/webapp/src/pages/chat/Chat.tsx | 20 +++++++++---------- 4 files changed, 15 insertions(+), 15 deletions(-) diff --git a/packages/chat-component/src/components/chat-history-controller.ts b/packages/chat-component/src/components/chat-history-controller.ts index 6d0ce32a..e0684503 100644 --- a/packages/chat-component/src/components/chat-history-controller.ts +++ b/packages/chat-component/src/components/chat-history-controller.ts @@ -9,7 +9,7 @@ import './chat-action-button.js'; export class ChatHistoryController implements ReactiveController { host: ReactiveControllerHost; - static CHATHISTORY_ID = 'component:chat-history'; + static CHATHISTORY_ID = 'ms-azoaicc:history'; chatHistory: ChatThreadEntry[] = []; diff --git a/packages/webapp/src/components/SettingsStyles/SettingsStyles.tsx b/packages/webapp/src/components/SettingsStyles/SettingsStyles.tsx index e38f29a8..b1f1b748 100644 --- a/packages/webapp/src/components/SettingsStyles/SettingsStyles.tsx +++ b/packages/webapp/src/components/SettingsStyles/SettingsStyles.tsx @@ -40,11 +40,11 @@ export const SettingsStyles = ({ onChange }: Props) => { }; const getInitialStyles = (): CustomStylesState => { - const storedStyles = localStorage.getItem('customStyles'); - const themeStore = localStorage.getItem('isDarkTheme'); + const storedStyles = localStorage.getItem('ms-azoaicc:customStyles'); + const themeStore = localStorage.getItem('ms-azoaicc:isDarkTheme'); const styleDefaults = themeStore === 'true' ? styleDefaultsDark : styleDefaultsLight; if (storedStyles === '') { - localStorage.setItem('customStyles', JSON.stringify(styleDefaults)); + localStorage.setItem('ms-azoaicc:customStyles', JSON.stringify(styleDefaults)); } return storedStyles ? JSON.parse(storedStyles) diff --git a/packages/webapp/src/components/ThemeSwitch/ThemeSwitch.tsx b/packages/webapp/src/components/ThemeSwitch/ThemeSwitch.tsx index cb7ecbe3..5f7f20d9 100644 --- a/packages/webapp/src/components/ThemeSwitch/ThemeSwitch.tsx +++ b/packages/webapp/src/components/ThemeSwitch/ThemeSwitch.tsx @@ -18,7 +18,7 @@ export const ThemeSwitch: React.FC = ({ onToggle, isDarkTheme, // Toggle 'dark' class on the shell app body element based on the isDarkTheme prop and isConfigPanelOpen document.body.classList.toggle('dark', isDarkTheme); document.documentElement.dataset.theme = isDarkTheme && isConfigPanelOpen ? 'dark' : ''; - localStorage.removeItem('isDarkTheme'); + localStorage.removeItem('ms-azoaicc:isDarkTheme'); }, [isDarkTheme, isConfigPanelOpen]); return ( diff --git a/packages/webapp/src/pages/chat/Chat.tsx b/packages/webapp/src/pages/chat/Chat.tsx index 1095a8fe..0ade9c49 100644 --- a/packages/webapp/src/pages/chat/Chat.tsx +++ b/packages/webapp/src/pages/chat/Chat.tsx @@ -26,7 +26,7 @@ const Chat = () => { const [isLoading] = useState(false); const [isBrandingEnabled, setEnableBranding] = useState(() => { - const storedBranding = localStorage.getItem('isBrandingEnabled'); + const storedBranding = localStorage.getItem('ms-azoaicc:isBrandingEnabled'); return storedBranding ? JSON.parse(storedBranding) : false; }); @@ -77,7 +77,7 @@ const Chat = () => { }; const [isDarkTheme, setIsDarkTheme] = useState(() => { - const storedTheme = localStorage.getItem('isDarkTheme'); + const storedTheme = localStorage.getItem('ms-azoaicc:isDarkTheme'); return storedTheme ? JSON.parse(storedTheme) : false; }); @@ -108,7 +108,7 @@ const Chat = () => { FontBaseSize: '14px', }; const defaultStyles = isDarkTheme ? styleDefaultsDark : styleDefaultsLight; - const storedStyles = localStorage.getItem('customStyles'); + const storedStyles = localStorage.getItem('ms-azoaicc:customStyles'); return storedStyles ? JSON.parse(storedStyles) : defaultStyles; }); @@ -126,7 +126,7 @@ const Chat = () => { chatComponent.setAttribute('data-theme', newIsDarkTheme ? 'dark' : ''); } // Update the body class and html data-theme - localStorage.removeItem('customStyles'); + localStorage.removeItem('ms-azoaicc:customStyles'); // Update the state setIsDarkTheme(newIsDarkTheme); @@ -135,17 +135,17 @@ const Chat = () => { useEffect(() => { // Update the state when local storage changes const handleStorageChange = () => { - const storedStyles = localStorage.getItem('customStyles'); + const storedStyles = localStorage.getItem('ms-azoaicc:customStyles'); if (storedStyles) { setCustomStyles(JSON.parse(storedStyles)); } - const storedBranding = localStorage.getItem('isBrandingEnabled'); + const storedBranding = localStorage.getItem('ms-azoaicc:isBrandingEnabled'); if (storedBranding) { setEnableBranding(JSON.parse(storedBranding)); } - const storedTheme = localStorage.getItem('isDarkTheme'); + const storedTheme = localStorage.getItem('ms-azoaicc:isDarkTheme'); if (storedTheme) { setIsDarkTheme(JSON.parse(storedTheme)); } @@ -155,13 +155,13 @@ const Chat = () => { window.addEventListener('storage', handleStorageChange); // Store customStyles in local storage whenever it changes - localStorage.setItem('customStyles', JSON.stringify(customStyles)); + localStorage.setItem('ms-azoaicc:customStyles', JSON.stringify(customStyles)); // Store isBrandingEnabled in local storage whenever it changes - localStorage.setItem('isBrandingEnabled', JSON.stringify(isBrandingEnabled)); + localStorage.setItem('ms-azoaicc:isBrandingEnabled', JSON.stringify(isBrandingEnabled)); // Store isDarkTheme in local storage whenever it changes - localStorage.setItem('isDarkTheme', JSON.stringify(isDarkTheme)); + localStorage.setItem('ms-azoaicc:isDarkTheme', JSON.stringify(isDarkTheme)); // Scroll into view when isLoading changes chatMessageStreamEnd.current?.scrollIntoView({ behavior: 'smooth' });