update linting and readme

Author: HenryHengZJ

README.md

@@ -171,6 +171,10 @@ You can also customize chatbot with different configuration
           company: 'Flowise',
           companyLink: 'https://flowiseai.com',
         },
+        disclaimer: {
+          title: 'Disclaimer',
+          message: 'By using this chatbot, you agree to the <a target="_blank" href="https://flowiseai.com/terms">Terms & Condition</a>',
+        }
       },
     },
   });

src/components/Bot.tsx

@@ -427,18 +427,18 @@ export const Bot = (botProps: BotProps & { class?: string }) => {
     setUploadedFiles([]);
     scrollToBottom();
   };
-  
+
   const handleDisclaimerAccept = () => {
     setDisclaimerPopupOpen(false); // Close the disclaimer popup
-    setCookie("chatbotDisclaimer", "true", 365); // Disclaimer accepted
+    setCookie('chatbotDisclaimer', 'true', 365); // Disclaimer accepted
   };
-  
+
   const promptClick = (prompt: string) => {
     handleSubmit(prompt);
   };
 
   // Handle form submission
-  const handleSubmit = async (value: string, action?: IAction | undefined | null) => {  
+  const handleSubmit = async (value: string, action?: IAction | undefined | null) => {
     if (value.trim() === '') {
       const containsFile = previews().filter((item) => !item.mime.startsWith('image') && item.type !== 'audio').length > 0;
       if (!previews().length || (previews().length && containsFile)) {
@@ -653,15 +653,14 @@ export const Bot = (botProps: BotProps & { class?: string }) => {
 
   // eslint-disable-next-line solid/reactivity
   createEffect(async () => {
-
     if (props.disclaimer) {
-      if (getCookie("chatbotDisclaimer") == "true") {
-        setDisclaimerPopupOpen(false)
+      if (getCookie('chatbotDisclaimer') == 'true') {
+        setDisclaimerPopupOpen(false);
       } else {
-        setDisclaimerPopupOpen(true)
+        setDisclaimerPopupOpen(true);
       }
     } else {
-      setDisclaimerPopupOpen(false)
+      setDisclaimerPopupOpen(false);
     }
 
     const chatMessage = getLocalStorageChatflow(props.chatflowid);
@@ -1350,12 +1349,11 @@ export const Bot = (botProps: BotProps & { class?: string }) => {
         <DisclaimerPopup
           isOpen={disclaimerPopupOpen()}
           onAccept={handleDisclaimerAccept}
-          title={props.disclaimer?.title} 
+          title={props.disclaimer?.title}
           message={props.disclaimer?.message}
           buttonText={props.disclaimer?.buttonText}
         />
       )}
-      
     </>
   );
 };

src/features/popup/components/DisclaimerPopup.tsx

@@ -9,13 +9,7 @@ export type DisclaimerPopupProps = {
 };
 
 export const DisclaimerPopup = (props: DisclaimerPopupProps) => {
-  const [popupProps] = splitProps(props, [
-    'onAccept',
-    'isOpen',
-    'title',
-    'message',
-    'buttonText',
-  ]);
+  const [popupProps] = splitProps(props, ['onAccept', 'isOpen', 'title', 'message', 'buttonText']);
 
   const handleAccept = () => {
     props.onAccept?.();
@@ -25,16 +19,13 @@ export const DisclaimerPopup = (props: DisclaimerPopupProps) => {
     <Show when={popupProps.isOpen}>
       <div class="fixed inset-0 rounded-lg flex items-center justify-center bg-black bg-opacity-40 backdrop-blur-sm z-50">
         <div class="bg-white p-10 rounded-lg shadow-lg max-w-md w-full text-center mx-4 font-sans">
-          <h2 class="text-2xl font-semibold mb-4 flex justify-center items-center">
-            {popupProps.title ?? 'Disclaimer'}
-          </h2>
+          <h2 class="text-2xl font-semibold mb-4 flex justify-center items-center">{popupProps.title ?? 'Disclaimer'}</h2>
 
           <p
             class="text-gray-700 text-base mb-6"
-            innerHTML={popupProps.message ??
-              'By using this chatbot, you acknowledge and accept these terms.'}
-          ></p>
-          
+            innerHTML={popupProps.message ?? 'By using this chatbot, you acknowledge and accept these terms.'}
+          />
+
           <div class="flex justify-center">
             <button
               class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-6 rounded focus:outline-none focus:shadow-outline"

src/utils/index.ts

@@ -130,13 +130,13 @@ export const getBubbleButtonSize = (size: 'small' | 'medium' | 'large' | number
 
 export const setCookie = (cname: string, cvalue: string, exdays: number) => {
   const d = new Date();
-  d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
-  const expires = "expires=" + d.toUTCString();
-  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
-}
+  d.setTime(d.getTime() + exdays * 24 * 60 * 60 * 1000);
+  const expires = 'expires=' + d.toUTCString();
+  document.cookie = cname + '=' + cvalue + ';' + expires + ';path=/';
+};
 
-export const getCookie = (cname: string): string =>{
-  const name = cname + "=";
+export const getCookie = (cname: string): string => {
+  const name = cname + '=';
   const decodedCookie = decodeURIComponent(document.cookie);
   const ca = decodedCookie.split(';');
   for (let i = 0; i < ca.length; i++) {
@@ -148,5 +148,5 @@ export const getCookie = (cname: string): string =>{
       return c.substring(name.length, c.length);
     }
   }
-  return "";
-}
+  return '';
+};