diff --git a/package.json b/package.json index be3452dd7..7b29ccb22 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,6 @@ "scripts": { "install:deps": "git submodule update --init --recursive && yarn install", "dev": "vite", - "build:types": "rm -rf dist; rm -rf icons; rm -rf icons; tsc; cp -R src/icons icons; cp -R src/icons dist/icons ; cp -R src/css css; cp -R src/css dist/css", "prebuild": "rm -rf ./dist && mv .env .env_temp || true", "postbuild": "mv .env_temp .env || true", "build": "yarn prebuild && tsc-silent -p './tsconfig.json' --suppress @ && vite build && yarn postbuild", @@ -64,7 +63,7 @@ "ts-pattern": "^5.1.1", "tsc-silent": "^1.2.2", "typescript": "5.0.2", - "vite": "5.2.10", + "vite": "5.2.14", "vite-plugin-dts": "^3.7.0", "vite-plugin-svgr": "^4.2.0", "vitest": "^1.6.0" diff --git a/src/components/BotProfileImage.tsx b/src/components/BotProfileImage.tsx index a99f570d3..a8d8bce6c 100644 --- a/src/components/BotProfileImage.tsx +++ b/src/components/BotProfileImage.tsx @@ -5,7 +5,7 @@ import { useChatContext } from './chat/context/ChatProvider'; import { getColorBasedOnSaturation } from '../colors'; import { useConstantState } from '../context/ConstantContext'; import { themedColors } from '../foundation/colors/css'; -import BotProfileIcon from '../icons/bot-profile-image-small.svg'; +import BotFilledIcon from '../icons/ic-bot-filled.svg'; function isMaybeFavicon(url: string) { if (url.length < 4) return false; @@ -44,7 +44,7 @@ const IconContainer = styled.span<{ backgroundColor: string; size: number }>` align-items: center; }`; -const Icon = styled(BotProfileIcon)<{ fill: string }>` +const Icon = styled(BotFilledIcon)<{ fill: string }>` path { fill: ${({ fill }) => fill}; } diff --git a/src/components/ErrorContainer.tsx b/src/components/ErrorContainer.tsx index 2e341e859..c6d7b3a2a 100644 --- a/src/components/ErrorContainer.tsx +++ b/src/components/ErrorContainer.tsx @@ -1,7 +1,7 @@ import styled from 'styled-components'; import { Label } from '../foundation/components/Label'; -import Icon from '../icons/icon-error.svg'; +import ErrorIcon from '../icons/ic-error.svg'; const Container = styled.div` width: 100%; @@ -14,7 +14,7 @@ const Container = styled.div` background-color: ${({ theme }) => theme.bgColor.loadingScreen}; `; -const ErrorIcon = styled(Icon)` +const Error = styled(ErrorIcon)` path { fill: ${({ theme }) => theme.textColor.errorMessage}; } @@ -29,7 +29,7 @@ const ErrorMessage = styled(Label)` export default function ErrorContainer({ errorMessage }: { errorMessage: string }) { return ( - + {errorMessage || 'Something went wrong'} diff --git a/src/components/LoadingScreen.tsx b/src/components/LoadingScreen.tsx index 0e6a90657..f5c0c53af 100644 --- a/src/components/LoadingScreen.tsx +++ b/src/components/LoadingScreen.tsx @@ -1,6 +1,6 @@ import styled, { keyframes } from 'styled-components'; -import SpinIcon from '../icons/spin-icon.svg'; +import SpinnerIcon from '../icons/ic-spinner.svg'; const spinner = keyframes` 0% { @@ -39,7 +39,7 @@ export default function LoadingScreen() { return ( - + ); diff --git a/src/components/MessageDataContent.tsx b/src/components/MessageDataContent.tsx index 61fb34c70..f61a17264 100644 --- a/src/components/MessageDataContent.tsx +++ b/src/components/MessageDataContent.tsx @@ -1,9 +1,9 @@ import styled from 'styled-components'; import { useConstantState } from '../context/ConstantContext'; -import ChevronRightIcon from '../icons/chevron-right.svg'; -import EllipsisIcon from '../icons/icon-ellipsis.svg'; -import MessageBubbleIcon from '../icons/icon-message-bubble.svg'; +import ChevronRightIcon from '../icons/ic-chevron-right.svg'; +import EllipsisIcon from '../icons/ic-ellipsis.svg'; +import MessageIcon from '../icons/ic-message.svg'; import { FunctionCallData } from '../types'; import { noop } from '../utils'; @@ -121,7 +121,7 @@ const AdditionalInfo = styled.div` margin-top: 5px; `; -const Icon = styled.div` +const IconContainer = styled.div` display: flex; justify-content: center; align-items: center; @@ -239,9 +239,9 @@ export default function MessageDataContent({ messageData }: MessageDataContentPr {workflow && ( - - - + + + {workflow.name} {workflow.type} @@ -250,17 +250,17 @@ export default function MessageDataContent({ messageData }: MessageDataContentPr )} {functionCalls.map((renderData, index) => ( - - - + + + {renderData.name} - View details - + {'View details'} + ))} - Only visible in the dashboard widget + {'Only visible in the dashboard widget'} ); diff --git a/src/components/SourceContainer.tsx b/src/components/SourceContainer.tsx index 564941ab2..bb079d12e 100644 --- a/src/components/SourceContainer.tsx +++ b/src/components/SourceContainer.tsx @@ -1,6 +1,6 @@ import styled from 'styled-components'; -import OpenLinkIcon from '../icons/open-link-icon.svg'; +import OpenIcon from '../icons/ic-open.svg'; const Root = styled.div` display: flex; @@ -37,7 +37,7 @@ const SourceItem = styled.div` gap: 16px; `; -const IconLink = styled.a` +const IconContainer = styled.a` display: flex; justify-content: center; align-items: center; @@ -72,13 +72,13 @@ export default function SourceContainer(props: Props) { Source
- + {source.title}
- - - + + + ); diff --git a/src/components/chat/ui/ChatHeader.tsx b/src/components/chat/ui/ChatHeader.tsx index faaf1b836..aa405f01c 100644 --- a/src/components/chat/ui/ChatHeader.tsx +++ b/src/components/chat/ui/ChatHeader.tsx @@ -8,8 +8,8 @@ import { useWidgetState } from '../../../context/WidgetStateContext'; import { themedColors } from '../../../foundation/colors/css'; import { Label } from '../../../foundation/components/Label'; import CloseIcon from '../../../icons/ic-close.svg'; +import CollapseIcon from '../../../icons/ic-collapse.svg'; import ExpandIcon from '../../../icons/ic-expand.svg'; -import CollapsedIcon from '../../../icons/icon-collapse.svg'; import BotProfileImage from '../../BotProfileImage'; import BetaLogo from '../../ui/BetaLogo'; import { useChatContext } from '../context/ChatProvider'; @@ -87,7 +87,7 @@ const RefreshButton = ({ size, onClick }: ButtonProps) => { const ExpandButton = ({ size }: ButtonProps) => { const { isExpanded, setIsExpanded } = useWidgetState(); - const Icon = isExpanded ? CollapsedIcon : ExpandIcon; + const Icon = isExpanded ? CollapseIcon : ExpandIcon; return ( setIsExpanded(!isExpanded)}> diff --git a/src/components/messages/CarouselMessage.tsx b/src/components/messages/CarouselMessage.tsx index d313b905d..baa294e46 100644 --- a/src/components/messages/CarouselMessage.tsx +++ b/src/components/messages/CarouselMessage.tsx @@ -2,8 +2,8 @@ import { ReactNode } from 'react'; import styled, { useTheme } from 'styled-components'; import { useConstantState } from '../../context/ConstantContext'; -import ChevronLeft from '../../icons/chevron-left.svg'; -import ChevronRight from '../../icons/chevron-right.svg'; +import ChevronLeft from '../../icons/ic-chevron-left.svg'; +import ChevronRight from '../../icons/ic-chevron-right.svg'; import { WidgetCarouselItem } from '../../types'; import { openURL } from '../../utils'; import { SnapCarousel } from '../ui/SnapCarousel'; diff --git a/src/components/ui/WidgetButton.tsx b/src/components/ui/WidgetButton.tsx index 4d1d4a544..819a5e9f2 100644 --- a/src/components/ui/WidgetButton.tsx +++ b/src/components/ui/WidgetButton.tsx @@ -2,8 +2,8 @@ import styled, { css } from 'styled-components'; import { getColorBasedOnSaturation } from '../../colors'; import { elementIds } from '../../const'; -import BotOutlinedIcon from '../../icons/bot-outlined.svg'; -import ChevronDownIcon from '../../icons/chevron-down.svg'; +import BotOutlinedIcon from '../../icons/ic-bot-outlined.svg'; +import ChevronDownIcon from '../../icons/ic-chevron-down.svg'; const buttonEffect = css` &:hover { diff --git a/src/dummy.ts b/src/dummy.ts deleted file mode 100644 index 43175d62f..000000000 --- a/src/dummy.ts +++ /dev/null @@ -1,81 +0,0 @@ -const DUMMY_MESSAGE1 = `I'd be happy to help! Here's an example of how to connect to Sendbird Chat SDK using JavaScript: - -\`\`\` -const sb = new SendBird({ appId: APP_ID }); -sb.connect(USER_ID, ACCESS_TOKEN, (user, error) => { - if (error) { - console.error(error); - return; - } - console.log(\`Connected as \`); -}); -\`\`\` - -This code initializes a new instance of the SendBird object with your app ID, then connects to the SDK using a user ID and access token. Once connected, the user ID is logged to the console. - -You can find more information about the Sendbird Chat SDK in the "Getting Started" guide at https://sendbird.com/docs/chat/v4/javascript/getting-started/send-first-message.`; - -const DUMMY_MESSAGE2 = `Sure! Here's an example of how to create a group channel using the Sendbird Chat SDK in JavaScript: - -\`\`\` -const sb = new SendBird({ appId: APP_ID }); -sb.connect(USER_ID, ACCESS_TOKEN, (user, error) => { - if (error) { - console.error(error); - return; - } - const params = new sb.GroupChannelParams(); - params.addUserIds([USER_ID_1, USER_ID_2]); - params.name = 'My Group Channel'; - params.coverUrl = 'https://example.com/my-group-channel-cover-image.jpg'; - sb.GroupChannel.createChannel(params, (channel, error) => { - if (error) { - console.error(error); - return; - } - console.log(\`Created group channel \`); - }); -}); -\`\`\` - -This code connects to the Sendbird Chat SDK using a user ID and access token, then creates a new group channel with the specified user IDs, name, and cover image URL. Once the channel is created, the channel URL is logged to the console. - -You can find more information about creating group channels in the "Creating a channel" guide at https://sendbird.com/docs/chat/v4/javascript/channel/creating-a-channel/create-a-channel.`; - -const DUMMY_MESSAGE3 = `Sure! Here are examples of how to get a list of users using the Sendbird Chat SDK in iOS and Android: - -iOS: -\`\`\` -let query = SBDUser.createApplicationUserListQuery() -query?.loadNextPage(completionHandler: { (users, error) in - if error != nil { - print("Error: \\(error!.localizedDescription)") - return - } - for user in users! { - print("User ID: \\(user.userId)") - } -}) -\`\`\` - -This code creates a query to get a list of application users, then loads the next page of users. Once the users are loaded, their user IDs are printed to the console. - -Android: -\`\`\` -SendBird.queryUserList(new SendBird.UserListQuery(), new SendBird.UserListQueryHandler() { - @Override - public void onResult(Listusers, SendBirdException e) { - if (e != null) { - Log.e(TAG, "Error getting user list: " + e.getMessage()); - return; - } - for (User user : users) { - Log.d(TAG, "User ID: " + user.getUserId()); - } - } -}); -\`\`\` - -This code creates a query to get a list of users, then retrieves the list`; - -export const DUMMIES = [DUMMY_MESSAGE1, DUMMY_MESSAGE2, DUMMY_MESSAGE3]; diff --git a/src/icons/bot-profile-image-small.svg b/src/icons/ic-bot-filled.svg similarity index 100% rename from src/icons/bot-profile-image-small.svg rename to src/icons/ic-bot-filled.svg diff --git a/src/icons/bot-outlined.svg b/src/icons/ic-bot-outlined.svg similarity index 100% rename from src/icons/bot-outlined.svg rename to src/icons/ic-bot-outlined.svg diff --git a/src/icons/chevron-down.svg b/src/icons/ic-chevron-down.svg similarity index 100% rename from src/icons/chevron-down.svg rename to src/icons/ic-chevron-down.svg diff --git a/src/icons/chevron-left.svg b/src/icons/ic-chevron-left.svg similarity index 100% rename from src/icons/chevron-left.svg rename to src/icons/ic-chevron-left.svg diff --git a/src/icons/chevron-right.svg b/src/icons/ic-chevron-right.svg similarity index 100% rename from src/icons/chevron-right.svg rename to src/icons/ic-chevron-right.svg diff --git a/src/icons/icon-collapse.svg b/src/icons/ic-collapse.svg similarity index 100% rename from src/icons/icon-collapse.svg rename to src/icons/ic-collapse.svg diff --git a/src/icons/icon-ellipsis.svg b/src/icons/ic-ellipsis.svg similarity index 100% rename from src/icons/icon-ellipsis.svg rename to src/icons/ic-ellipsis.svg diff --git a/src/icons/icon-error.svg b/src/icons/ic-error.svg similarity index 100% rename from src/icons/icon-error.svg rename to src/icons/ic-error.svg diff --git a/src/icons/icon-message-bubble.svg b/src/icons/ic-message.svg similarity index 100% rename from src/icons/icon-message-bubble.svg rename to src/icons/ic-message.svg diff --git a/src/icons/open-link-icon.svg b/src/icons/ic-open.svg similarity index 100% rename from src/icons/open-link-icon.svg rename to src/icons/ic-open.svg diff --git a/src/icons/ic-sendbird-colored.svg b/src/icons/ic-sendbird-colored.svg deleted file mode 100644 index 3bc584219..000000000 --- a/src/icons/ic-sendbird-colored.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/icons/spin-icon.svg b/src/icons/ic-spinner.svg similarity index 100% rename from src/icons/spin-icon.svg rename to src/icons/ic-spinner.svg diff --git a/src/icons/icon-send.svg b/src/icons/icon-send.svg deleted file mode 100644 index b386996e7..000000000 --- a/src/icons/icon-send.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - diff --git a/src/icons/info-icon.svg b/src/icons/info-icon.svg deleted file mode 100644 index 066603c6b..000000000 --- a/src/icons/info-icon.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/src/icons/sendbird-logo-widget.svg b/src/icons/sendbird-logo-widget.svg deleted file mode 100644 index 2624444c3..000000000 --- a/src/icons/sendbird-logo-widget.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts index 46458c690..11f02fe2a 100644 --- a/src/vite-env.d.ts +++ b/src/vite-env.d.ts @@ -1,2 +1 @@ /// -declare const APP_VERSION: string; diff --git a/yarn.lock b/yarn.lock index 78ac00547..f1897c317 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3294,7 +3294,7 @@ __metadata: ts-pattern: "npm:^5.1.1" tsc-silent: "npm:^1.2.2" typescript: "npm:5.0.2" - vite: "npm:5.2.10" + vite: "npm:5.2.14" vite-plugin-dts: "npm:^3.7.0" vite-plugin-svgr: "npm:^4.2.0" vitest: "npm:^1.6.0" @@ -18161,9 +18161,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:5.2.10": - version: 5.2.10 - resolution: "vite@npm:5.2.10" +"vite@npm:5.2.14": + version: 5.2.14 + resolution: "vite@npm:5.2.14" dependencies: esbuild: "npm:^0.20.1" fsevents: "npm:~2.3.3" @@ -18197,7 +18197,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10c0/d50630ac8de807a6185cd9b5763b3969b2950a454cf6a4482f3780f183865e8d6f7e3aa57dd70ede1c493aaa861efb25b43562287efbcf8b471b7f3b88857a33 + checksum: 10c0/0ed7a8f8274d14bbd01be2ca5c7c539f915e75d884a97f6051cdf494997832bc02c7db9fc9c5ba8f057d5fece28a3bf215761815e6014e843abe2c38a9424fb7 languageName: node linkType: hard