Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat/update molecules #184

Merged
merged 12 commits into from
Oct 17, 2024
128 changes: 122 additions & 6 deletions apps/all-molecule-app/app/share-buttons/page.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,125 @@
'use client'
import { ShareButtons } from '@samagra-x/stencil-molecules'
import React from 'react'
import React, { useContext, useMemo, useState } from 'react'

const ShareButton = () => {
return <ShareButtons />
// import { useLocalization } from '../../hooks'
// import { AppContext } from '../../context'
import { useColorPalates } from '../../provider/theme-provider/hooks'
import { useConfig } from '../../provider/config-provider/hook'
import { ShareButtons as ImportedShareButton } from '@samagra-x/stencil-molecules'
const ShareButtons = () => {
const config = useConfig('component', 'share-buttons')
const theme = useColorPalates()
const secondaryColor = useMemo(() => {
return theme?.primary?.main
}, [theme?.primary?.main])

const [shareLoader, setShareLoader] = useState(false)
const [downloadLoader, setDownloadLoader] = useState(false)

// const downloadChat = async () => {
// const url = `${
// process.env.NEXT_PUBLIC_BFF_API_URL
// }/history/generate-pdf/${sessionStorage.getItem('conversationId')}`;

// return axios.get(url, {
// headers: {
// botId: '74b41966-c74a-43e7-ba43-07f038893cb4' || '',
// userId: localStorage.getItem('userID'),
// template: 'kmai-dev' || 'akai',
// },
// });
// };

// const downloadShareHandler = async (
// event: React.MouseEvent<HTMLDivElement, MouseEvent>,
// type: string
// ) => {
// try {
// if (type === 'download') {
// setDownloadLoader(true);
// } else setShareLoader(true);

// const response = await downloadChat();
// const pdfUrl = response.data.pdfUrl;

// if (!pdfUrl) {
// toast.error(`${t('message.no_link')}`);
// return;
// }

// if (type === 'download') {
// setDownloadLoader(false);
// toast.success(`${t('message.downloading')}`);
// const link = document.createElement('a');

// link.href = pdfUrl;
// link.target = '_blank';
// // link.href = window.URL.createObjectURL(blob);

// link.download = 'Chat.pdf';
// link.click();
// setDownloadLoader(false);
// context?.downloadChat(pdfUrl);
// } else if (type === 'share') {
// setShareLoader(false);
// const response = await axios.get(pdfUrl, {
// responseType: 'arraybuffer',
// });
// const blob = new Blob([response.data], { type: 'application/pdf' });
// const file = new File([blob], 'Chat.pdf', { type: blob.type });

// setShareLoader(false);

// if (!navigator.canShare) {
// //@ts-ignore
// if (window?.AndroidHandler?.shareUrl) {
// //@ts-ignore
// window.AndroidHandler.shareUrl(pdfUrl);
// } else {
// context?.shareChat(pdfUrl);
// }
// } else if (navigator.canShare({ files: [file] })) {
// toast.success(`${t('message.sharing')}`);
// console.log('hurray', file);
// await navigator
// .share({
// files: [file],
// title: 'Chat',
// text: 'Check out my chat with Bot!',
// })
// .catch((error) => {
// toast.error(error.message);
// console.error('Error sharing', error);
// });
// } else {
// toast.error(`${t('message.cannot_share')}`);
// console.error("Your system doesn't support sharing this file.");
// }
// } else {
// // console.log(response.data);
// setDownloadLoader(false);
// setShareLoader(false);
// }
// } catch (error: any) {
// console.error(error);
// setDownloadLoader(false);
// setShareLoader(false);
// if (error.message === "Cannot read properties of undefined (reading 'shareUrl')") {
// toast.success(`${t('message.shareUrl_android_error')}`);
// } else toast.error(error.message);

// console.error(error);
// }
// };

Comment on lines +18 to +112
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Consider removing commented-out code to improve readability

There is a large block of commented-out code from lines 18 to 112. Keeping extensive commented-out code can clutter the codebase and make maintenance more challenging. If this code is no longer needed, consider removing it. If it's intended for future implementation, it's advisable to track it using version control or document it elsewhere.

return (
<ImportedShareButton
allowDownloadChat={config?.allowDownloadChat}
handleButton={() => {}}
allowShareChat={config?.allowShareChat}
shareLoader={shareLoader}
downloadLoader={downloadLoader}
/>
)
}

export default ShareButton
export default ShareButtons
25 changes: 3 additions & 22 deletions apps/kisai-bot/src/components/blinking-spinner/index.tsx
Original file line number Diff line number Diff line change
@@ -1,28 +1,9 @@
import { BlinkingSpinner as ImportedBlinkingSpinner } from '@samagra-x/stencil-molecules/lib';

import React from 'react';

const styles = {
spinner: {
display: 'inline-block',
height: '15px',
width: '1px',
animation: 'blink 0.5s infinite',
backgroundColor: '#000',
},
};
const BlinkingSpinner = () => {
return (
<>
<style>
{`
@keyframes blink {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
`}
</style>
<p style={styles.spinner}></p>;
</>
);
return <ImportedBlinkingSpinner spinerStyle={{}} />;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Review the spinerStyle prop usage.

The simplified implementation is good for maintainability. However, there are two potential issues to address:

  1. If no styles are needed, consider removing the spinerStyle prop entirely.
  2. There's a typo in spinerStyle (missing 'n'). Verify if the imported component expects spinnerStyle instead.

If no styles are needed and the prop name is correct, you can simplify it further:

return <ImportedBlinkingSpinner />;

If the prop name should be spinnerStyle, correct it:

return <ImportedBlinkingSpinner spinnerStyle={{}} />;

};

export default BlinkingSpinner;
2 changes: 1 addition & 1 deletion apps/kisai-bot/src/components/fullpage-loader/index.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { FullPageLoader } from '@samagra-x/stencil-molecules/lib/fullpage-loader';
import { FullPageLoader } from '@samagra-x/stencil-molecules/lib';

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Inconsistent import paths detected from '@samagra-x/stencil-molecules'.

Multiple files import from both @samagra-x/stencil-molecules/lib and @samagra-x/stencil-molecules/. For consistency, please update the following imports to use the general path:

  • apps/all-molecule-app/app/on-boarding-page/login-mobile/index.tsx
🔗 Analysis chain

LGTM! Verify import consistency across the project.

The import statement has been updated to use a more general path. This change looks good and may reflect a restructuring of the '@samagra-x/stencil-molecules' package.

To ensure consistency across the project, please run the following script to check for any other imports from '@samagra-x/stencil-molecules' that might need updating:

This will help identify any other files that might need similar import path updates.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for other imports from '@samagra-x/stencil-molecules' that might need updating

# Search for imports from '@samagra-x/stencil-molecules'
rg --type typescript --type javascript "from '@samagra-x/stencil-molecules/" -g '!**/node_modules/**'

Length of output: 141


Script:

#!/bin/bash
# Description: Check for other imports from '@samagra-x/stencil-molecules' that might need updating

# Search for imports from '@samagra-x/stencil-molecules' in TypeScript and JavaScript files
rg --type ts --type tsx --type js --type jsx "from '@samagra-x/stencil-molecules/" -g '!**/node_modules/**'

Length of output: 140


Script:

#!/bin/bash
# Description: Check for other imports from '@samagra-x/stencil-molecules' that might need updating

# Search for imports from '@samagra-x/stencil-molecules' in TypeScript and JavaScript files using glob patterns
rg --glob '**/*.ts' --glob '**/*.tsx' --glob '**/*.js' --glob '**/*.jsx' "from '@samagra-x/stencil-molecules/" -g '!**/node_modules/**'

Length of output: 1579

interface FullPageLoaderProps {
loading: boolean;
Expand Down
6 changes: 5 additions & 1 deletion apps/kisai-bot/src/components/language-picker/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { useColorPalates } from '../../providers/theme-provider/hooks';
import { useConfig } from '../../hooks/useConfig';
import { AppContext } from '../../context';
import router from 'next/router';
import NewLanguagePicker from '@samagra-x/stencil-molecules/lib/language-picker/languagePicker';
import { LanguagePicker as NewLanguagePicker } from '@samagra-x/stencil-molecules/lib/';
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Multiple imports from @samagra-x/stencil-molecules require updating.

The recent change to the import statement in apps/kisai-bot/src/components/language-picker/index.tsx affects several other files. Please update the imports in the following locations to align with the new package structure:

  • packages/pages/src/welcome-page/index.tsx
  • packages/pages/src/user-type-selector/index.tsx
  • packages/pages/src/otp-page/index.tsx
  • packages/pages/src/otp-mobile/index.tsx
  • apps/kisai-bot/src/pageComponents/login-page/index.tsx
  • apps/kisai-bot/src/pageComponents/otp-page/index.tsx
  • packages/pages/src/login-mobile/index.tsx
  • apps/kisai-bot/src/pageComponents/feedback-page/index.tsx
  • apps/kisai-bot/src/pageComponents/history-page/index.tsx
  • apps/kisai-bot/src/components/share-buttons/index.tsx
  • apps/kisai-bot/src/components/fullpage-loader/index.tsx
  • apps/kisai-bot/src/components/navbar/index.tsx
  • apps/kisai-bot/src/components/sidebar/index.tsx
  • apps/kisai-bot/src/components/transliteration-input/index.tsx
  • packages/pages/src/history-page/index.tsx
  • apps/kisai-bot/src/components/blinking-spinner/index.tsx
  • apps/bot-app/app/src/pages/chat.tsx
  • apps/bot-app/app/src/pages/_app.tsx
  • apps/bot-app/app/layout.tsx
  • apps/bot-app/app/chat/ClientComponent.tsx
  • apps/all-molecule-app/app/share-buttons/page.tsx
  • apps/all-molecule-app/app/otp-page/page.tsx
  • apps/all-molecule-app/app/on-boarding-page/welcome-page/index.tsx
  • apps/all-molecule-app/app/molecules/page.tsx
  • apps/all-molecule-app/app/on-boarding-page/login-mobile/index.tsx
  • apps/all-molecule-app/app/on-boarding-page/user-type-selector/index.tsx
  • apps/all-molecule-app/app/final-molecules/page.tsx
  • apps/all-molecule-app/app/on-boarding-page/otp-mobile/index.tsx
  • apps/all-molecule-app/components/index.tsx
  • apps/bot-app/components/index.tsx
  • apps/all-molecule-app/app/history-page/page.tsx
  • apps/all-molecule-app/app/feedback-page/page.tsx
  • apps/all-molecule-app/app/chat-ui/page.tsx

Ensure that all these imports are updated to use the named imports from the updated @samagra-x/stencil-molecules package structure to maintain consistency and functionality across the codebase.

🔗 Analysis chain

LGTM. Verify impact on other imports.

The import statement has been correctly updated to use a named import from the new package structure. This change aligns with the modifications in the @samagra-x/stencil-molecules package.

To ensure consistency across the codebase, please run the following script to check for any other imports from this package that might need updating:


Please run the following corrected script to check for other imports from @samagra-x/stencil-molecules:

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for other imports from @samagra-x/stencil-molecules that might need updating

# Search for imports from @samagra-x/stencil-molecules
rg --type typescript --type javascript "from '@samagra-x/stencil-molecules" -g '!**/node_modules/**'

Length of output: 140


Script:

#!/bin/bash
# Description: Check for other imports from @samagra-x/stencil-molecules that might need updating

# Search for imports from @samagra-x/stencil-molecules using corrected type flags
rg --type ts --type js "from '@samagra-x/stencil-molecules" -g '!**/node_modules/**'

Length of output: 4662


const LanguagePicker = () => {
const config = useConfig('component', 'sidebar');
Expand Down Expand Up @@ -49,6 +49,10 @@ const LanguagePicker = () => {
border: 'none',
borderRadius: '10px',
height: '36px',
color: '#fff',
},
selectStyle: {
color: theme?.primary?.contrastText,
},
}}
/>
Expand Down
8 changes: 5 additions & 3 deletions apps/kisai-bot/src/components/navbar/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import Sidebar from '../sidebar';
import { AppContext } from '../../context';
import { useLocalization } from '../../hooks';
import toast from 'react-hot-toast';
import Nav from '@samagra-x/stencil-molecules/lib/navbar/navbar';
import { Navbar as ImportedNavbar } from '@samagra-x/stencil-molecules/lib';

const Navbar: React.FC = () => {
const router = useRouter();
Expand All @@ -32,10 +32,12 @@ const Navbar: React.FC = () => {
if (router.pathname === '/login' || router.pathname === '/otp') return null;

return (
<Nav
<ImportedNavbar
onToggle={toggleSidebar}
isOpen={isSidebarOpen}
showHamburgerMenu={true}
backIconRoutes={['/faq', '/history', '/feedback']}
noMenuOrBackRoutes={[]}
centerLogoIcons={[
{
id: 'logo1',
Expand All @@ -62,7 +64,7 @@ const Navbar: React.FC = () => {
}}
>
<Sidebar isOpen={isSidebarOpen} onToggle={toggleSidebar} />
</Nav>
</ImportedNavbar>
);
};

Expand Down
142 changes: 38 additions & 104 deletions apps/kisai-bot/src/components/share-buttons/index.tsx
Original file line number Diff line number Diff line change
@@ -1,17 +1,15 @@
import React, { useContext, useMemo, useState } from 'react';
import Image from 'next/image';
import Loader from '../loader';
import Draggable from 'react-draggable';
import { useLocalization } from '../../hooks';
import ShareIcon from '../../assets/icons/share';
import DownloadIcon from '../../assets/icons/download';
import { toast } from 'react-hot-toast';
import { AppContext } from '../../context';
import axios from 'axios';
import { CircularProgress, Divider } from '@mui/material';
import { useLocalization } from '../../hooks';
import { useColorPalates } from '../../providers/theme-provider/hooks';
import { useConfig } from '../../hooks/useConfig';
<<<<<<< Updated upstream
import NewShareButtons from '@samagra-x/stencil-molecules/lib/share-buttons/shareButtons';

=======
import { ShareButtons as ImportedShareButton } from '@samagra-x/stencil-molecules/lib';
>>>>>>> Stashed changes
Comment on lines +7 to +12
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Resolve merge conflict markers in the import statements

Unresolved merge conflict markers (<<<<<<<, =======, >>>>>>>) are present at lines 7-12, which will cause syntax errors and prevent the code from compiling.

Apply this diff to resolve the merge conflicts:

-import NewShareButtons from '@samagra-x/stencil-molecules/lib/share-buttons/shareButtons';
+import { ShareButtons as ImportedShareButton } from '@samagra-x/stencil-molecules/lib';
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<<<<<<< Updated upstream
import NewShareButtons from '@samagra-x/stencil-molecules/lib/share-buttons/shareButtons';
=======
import { ShareButtons as ImportedShareButton } from '@samagra-x/stencil-molecules/lib';
>>>>>>> Stashed changes
import { ShareButtons as ImportedShareButton } from '@samagra-x/stencil-molecules/lib';
🧰 Tools
🪛 Biome

[error] 9-10: Expected a statement but instead found '======='.

Expected a statement here.

(parse)


[error] 11-12: Expected a statement but instead found '>>>>>>> Stashed changes'.

Expected a statement here.

(parse)

const ShareButtons = () => {
const config = useConfig('component', 'share-buttons');
const theme = useColorPalates();
Expand All @@ -24,106 +22,35 @@ const ShareButtons = () => {
const [shareLoader, setShareLoader] = useState(false);
const [downloadLoader, setDownloadLoader] = useState(false);

// const downloadChat = async () => {
// const url = `${
// process.env.NEXT_PUBLIC_BFF_API_URL
// }/history/generate-pdf/${sessionStorage.getItem('conversationId')}`;

// return axios.get(url, {
// headers: {
// botId: '74b41966-c74a-43e7-ba43-07f038893cb4' || '',
// userId: localStorage.getItem('userID'),
// template: 'kmai-dev' || 'akai',
// },
// });
// };

// const downloadShareHandler = async (
// event: React.MouseEvent<HTMLDivElement, MouseEvent>,
// type: string
// ) => {
// try {
// if (type === 'download') {
// setDownloadLoader(true);
// } else setShareLoader(true);

// const response = await downloadChat();
// const pdfUrl = response.data.pdfUrl;

// if (!pdfUrl) {
// toast.error(`${t('message.no_link')}`);
// return;
// }

// if (type === 'download') {
// setDownloadLoader(false);
// toast.success(`${t('message.downloading')}`);
// const link = document.createElement('a');

// link.href = pdfUrl;
// link.target = '_blank';
// // link.href = window.URL.createObjectURL(blob);

// link.download = 'Chat.pdf';
// link.click();
// setDownloadLoader(false);
// context?.downloadChat(pdfUrl);
// } else if (type === 'share') {
// setShareLoader(false);
// const response = await axios.get(pdfUrl, {
// responseType: 'arraybuffer',
// });
// const blob = new Blob([response.data], { type: 'application/pdf' });
// const file = new File([blob], 'Chat.pdf', { type: blob.type });
const handleShareButton = async (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setShareLoader(true);
try {
// Add your share logic here
toast.success(t('Share successful!'));
} catch (error) {
toast.error(t('Error sharing the chat.'));
} finally {
setShareLoader(false);
}
};

// setShareLoader(false);

// if (!navigator.canShare) {
// //@ts-ignore
// if (window?.AndroidHandler?.shareUrl) {
// //@ts-ignore
// window.AndroidHandler.shareUrl(pdfUrl);
// } else {
// context?.shareChat(pdfUrl);
// }
// } else if (navigator.canShare({ files: [file] })) {
// toast.success(`${t('message.sharing')}`);
// console.log('hurray', file);
// await navigator
// .share({
// files: [file],
// title: 'Chat',
// text: 'Check out my chat with Bot!',
// })
// .catch((error) => {
// toast.error(error.message);
// console.error('Error sharing', error);
// });
// } else {
// toast.error(`${t('message.cannot_share')}`);
// console.error("Your system doesn't support sharing this file.");
// }
// } else {
// // console.log(response.data);
// setDownloadLoader(false);
// setShareLoader(false);
// }
// } catch (error: any) {
// console.error(error);
// setDownloadLoader(false);
// setShareLoader(false);
// if (error.message === "Cannot read properties of undefined (reading 'shareUrl')") {
// toast.success(`${t('message.shareUrl_android_error')}`);
// } else toast.error(error.message);

// console.error(error);
// }
// };
const handleDownloadButton = async (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
setDownloadLoader(true);
try {
// Add your download logic here
toast.success(t('Download successful!'));
} catch (error) {
toast.error(t('Error downloading the chat.'));
} finally {
setDownloadLoader(false);
}
};

return (
<NewShareButtons
<ImportedShareButton
allowDownloadChat={config?.allowDownloadChat}
handleButton={() => {}}
handleDownloadButton={handleDownloadButton}
handleShareButton={handleShareButton}
allowShareChat={config?.allowShareChat}
shareLoader={shareLoader}
downloadLoader={downloadLoader}
Expand All @@ -132,3 +59,10 @@ const ShareButtons = () => {
};

export default ShareButtons;







Loading
Loading