diff --git a/.devcontainer/Dockerfile b/.devcontainer/Dockerfile index 3fd4f1a31..9e8c36fdb 100644 --- a/.devcontainer/Dockerfile +++ b/.devcontainer/Dockerfile @@ -4,5 +4,15 @@ FROM ghcr.io/chatwoot/chatwoot_codespace:latest # Do the set up required for chatwoot app WORKDIR /workspace + +# Copy dependency files first for better caching +COPY package.json pnpm-lock.yaml ./ +COPY Gemfile Gemfile.lock ./ + +# Install dependencies (will be cached if files don't change) +RUN pnpm install --frozen-lockfile && \ + gem install bundler && \ + bundle install --jobs=$(nproc) + +# Copy source code after dependencies are installed COPY . /workspace -RUN yarn && gem install bundler && bundle install diff --git a/.devcontainer/Dockerfile.base b/.devcontainer/Dockerfile.base index fe31dc42e..2b74602b8 100644 --- a/.devcontainer/Dockerfile.base +++ b/.devcontainer/Dockerfile.base @@ -1,12 +1,16 @@ - -ARG VARIANT +ARG VARIANT="ubuntu-22.04" FROM mcr.microsoft.com/vscode/devcontainers/base:0-${VARIANT} +ENV DEBIAN_FRONTEND=noninteractive + ARG NODE_VERSION ARG RUBY_VERSION ARG USER_UID ARG USER_GID +ARG PNPM_VERSION="10.2.0" +ENV PNPM_VERSION ${PNPM_VERSION} +ENV RUBY_CONFIGURE_OPTS=--disable-install-doc # Update args in docker-compose.yaml to set the UID/GID of the "vscode" user. RUN if [ "$USER_GID" != "1000" ] || [ "$USER_UID" != "1000" ]; then \ @@ -15,61 +19,80 @@ RUN if [ "$USER_GID" != "1000" ] || [ "$USER_UID" != "1000" ]; then \ && chmod -R $USER_UID:$USER_GID /home/vscode; \ fi -RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \ - && apt-get -y install --no-install-recommends \ - build-essential \ - libssl-dev \ - zlib1g-dev \ - gnupg2 \ - tar \ - tzdata \ - postgresql-client \ - libpq-dev \ - yarn \ - git \ - imagemagick \ - tmux \ - zsh \ - git-flow \ - npm \ - libyaml-dev +RUN NODE_MAJOR=$(echo $NODE_VERSION | cut -d. -f1) \ + && curl -fsSL https://deb.nodesource.com/setup_${NODE_MAJOR}.x | bash - \ + && apt-get update \ + && apt-get -y install --no-install-recommends \ + build-essential \ + libssl-dev \ + zlib1g-dev \ + gnupg \ + tar \ + tzdata \ + postgresql-client \ + libpq-dev \ + git \ + imagemagick \ + libyaml-dev \ + curl \ + ca-certificates \ + tmux \ + nodejs \ + && apt-get clean \ + && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* -# Install rbenv and ruby -RUN git clone https://github.com/rbenv/rbenv.git ~/.rbenv \ +# Install rbenv and ruby for root user first +RUN git clone --depth 1 https://github.com/rbenv/rbenv.git ~/.rbenv \ && echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc \ && echo 'eval "$(rbenv init -)"' >> ~/.bashrc ENV PATH "/root/.rbenv/bin/:/root/.rbenv/shims/:$PATH" -RUN git clone https://github.com/rbenv/ruby-build.git && \ +RUN git clone --depth 1 https://github.com/rbenv/ruby-build.git && \ PREFIX=/usr/local ./ruby-build/install.sh RUN rbenv install $RUBY_VERSION && \ rbenv global $RUBY_VERSION && \ rbenv versions -# Install overmind +# Set up rbenv for vscode user +RUN su - vscode -c "git clone --depth 1 https://github.com/rbenv/rbenv.git ~/.rbenv" \ + && su - vscode -c "echo 'export PATH=\"\$HOME/.rbenv/bin:\$PATH\"' >> ~/.bashrc" \ + && su - vscode -c "echo 'eval \"\$(rbenv init -)\"' >> ~/.bashrc" \ + && su - vscode -c "PATH=\"/home/vscode/.rbenv/bin:\$PATH\" rbenv install $RUBY_VERSION" \ + && su - vscode -c "PATH=\"/home/vscode/.rbenv/bin:\$PATH\" rbenv global $RUBY_VERSION" + +# Install overmind and gh in single layer RUN curl -L https://github.com/DarthSim/overmind/releases/download/v2.1.0/overmind-v2.1.0-linux-amd64.gz > overmind.gz \ && gunzip overmind.gz \ - && sudo mv overmind /usr/local/bin \ - && chmod +x /usr/local/bin/overmind - - -# Install gh -RUN curl -fsSL https://cli.github.com/packages/githubcli-archive-keyring.gpg | sudo dd of=/usr/share/keyrings/githubcli-archive-keyring.gpg \ - && echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/githubcli-archive-keyring.gpg] https://cli.github.com/packages stable main" | sudo tee /etc/apt/sources.list.d/github-cli.list > /dev/null \ - && sudo apt update \ - && sudo apt install gh + && mv overmind /usr/local/bin \ + && chmod +x /usr/local/bin/overmind \ + && curl -fsSL https://cli.github.com/packages/githubcli-archive-keyring.gpg | dd of=/usr/share/keyrings/githubcli-archive-keyring.gpg \ + && echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/githubcli-archive-keyring.gpg] https://cli.github.com/packages stable main" | tee /etc/apt/sources.list.d/github-cli.list > /dev/null \ + && apt-get update \ + && apt-get install -y --no-install-recommends gh \ + && apt-get clean \ + && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* # Do the set up required for chatwoot app WORKDIR /workspace -COPY . /workspace +RUN chown vscode:vscode /workspace -# set up ruby -COPY Gemfile Gemfile.lock ./ -RUN gem install bundler && bundle install +# set up node js and pnpm in single layer +RUN npm install -g pnpm@${PNPM_VERSION} \ + && npm cache clean --force -# set up node js -RUN npm install n -g && \ - n $NODE_VERSION -RUN npm install --global yarn -RUN yarn +# Switch to vscode user +USER vscode +ENV PATH="/home/vscode/.rbenv/bin:/home/vscode/.rbenv/shims:$PATH" + +# Copy dependency files first for better caching +COPY --chown=vscode:vscode Gemfile Gemfile.lock package.json pnpm-lock.yaml ./ + +# Install dependencies as vscode user +RUN eval "$(rbenv init -)" \ + && gem install bundler -N \ + && bundle install --jobs=$(nproc) \ + && pnpm install --frozen-lockfile + +# Copy source code after dependencies are installed +COPY --chown=vscode:vscode . /workspace diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index d2dac356b..c51338b51 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -23,15 +23,15 @@ // 5432 postgres // 6379 redis // 1025,8025 mailhog - "forwardPorts": [8025, 3000, 3035], + "forwardPorts": [8025, 3000, 3036], - "postCreateCommand": ".devcontainer/scripts/setup.sh && POSTGRES_STATEMENT_TIMEOUT=600s bundle exec rake db:chatwoot_prepare && yarn", + "postCreateCommand": ".devcontainer/scripts/setup.sh && POSTGRES_STATEMENT_TIMEOUT=600s bundle exec rake db:chatwoot_prepare && pnpm install", "portsAttributes": { "3000": { "label": "Rails Server" }, - "3035": { - "label": "Webpack Dev Server" + "3036": { + "label": "Vite Dev Server" }, "8025": { "label": "Mailhog UI" diff --git a/.devcontainer/docker-compose.base.yml b/.devcontainer/docker-compose.base.yml new file mode 100644 index 000000000..6932b5f10 --- /dev/null +++ b/.devcontainer/docker-compose.base.yml @@ -0,0 +1,18 @@ +# Docker Compose file for building the base image in GitHub Actions +# Usage: docker-compose -f .devcontainer/docker-compose.base.yml build base + +version: '3' + +services: + base: + build: + context: .. + dockerfile: .devcontainer/Dockerfile.base + args: + VARIANT: 'ubuntu-22.04' + NODE_VERSION: '23.7.0' + RUBY_VERSION: '3.4.4' + # On Linux, you may need to update USER_UID and USER_GID below if not your local UID is not 1000. + USER_UID: '1000' + USER_GID: '1000' + image: ghcr.io/chatwoot/chatwoot_codespace:latest diff --git a/.devcontainer/docker-compose.yml b/.devcontainer/docker-compose.yml index 21a9fe909..a9185ea09 100644 --- a/.devcontainer/docker-compose.yml +++ b/.devcontainer/docker-compose.yml @@ -5,19 +5,6 @@ version: '3' services: - base: - build: - context: .. - dockerfile: .devcontainer/Dockerfile.base - args: - VARIANT: 'ubuntu-22.04' - NODE_VERSION: '23.7.0' - RUBY_VERSION: '3.4.4' - # On Linux, you may need to update USER_UID and USER_GID below if not your local UID is not 1000. - USER_UID: '1000' - USER_GID: '1000' - image: base:latest - app: build: context: .. diff --git a/.devcontainer/scripts/setup.sh b/.devcontainer/scripts/setup.sh index 4ffee2d3a..6beb2ff57 100755 --- a/.devcontainer/scripts/setup.sh +++ b/.devcontainer/scripts/setup.sh @@ -2,12 +2,7 @@ cp .env.example .env sed -i -e '/REDIS_URL/ s/=.*/=redis:\/\/localhost:6379/' .env sed -i -e '/POSTGRES_HOST/ s/=.*/=localhost/' .env sed -i -e '/SMTP_ADDRESS/ s/=.*/=localhost/' .env -sed -i -e "/FRONTEND_URL/ s/=.*/=https:\/\/$CODESPACE_NAME-3000.githubpreview.dev/" .env -sed -i -e "/WEBPACKER_DEV_SERVER_PUBLIC/ s/=.*/=https:\/\/$CODESPACE_NAME-3035.githubpreview.dev/" .env -# uncomment the webpacker env variable -sed -i -e '/WEBPACKER_DEV_SERVER_PUBLIC/s/^# //' .env -# fix the error with webpacker -echo 'export NODE_OPTIONS=--openssl-legacy-provider' >> ~/.zshrc +sed -i -e "/FRONTEND_URL/ s/=.*/=https:\/\/$CODESPACE_NAME-3000.app.github.dev/" .env # codespaces make the ports public -gh codespace ports visibility 3000:public 3035:public 8025:public -c $CODESPACE_NAME +gh codespace ports visibility 3000:public 3036:public 8025:public -c $CODESPACE_NAME diff --git a/.github/workflows/publish_codespace_image.yml b/.github/workflows/publish_codespace_image.yml index 647608473..5da4fda05 100644 --- a/.github/workflows/publish_codespace_image.yml +++ b/.github/workflows/publish_codespace_image.yml @@ -19,6 +19,5 @@ jobs: - name: Build the Codespace Base Image run: | - docker-compose -f .devcontainer/docker-compose.yml build base - docker tag base:latest ghcr.io/chatwoot/chatwoot_codespace:latest + docker compose -f .devcontainer/docker-compose.base.yml build base docker push ghcr.io/chatwoot/chatwoot_codespace:latest diff --git a/app/controllers/api/v1/accounts/agent_bots_controller.rb b/app/controllers/api/v1/accounts/agent_bots_controller.rb index 1422beea1..64c35d33d 100644 --- a/app/controllers/api/v1/accounts/agent_bots_controller.rb +++ b/app/controllers/api/v1/accounts/agent_bots_controller.rb @@ -29,6 +29,11 @@ class Api::V1::Accounts::AgentBotsController < Api::V1::Accounts::BaseController head :ok end + def reset_access_token + @agent_bot.access_token.regenerate_token + @agent_bot.reload + end + private def agent_bot diff --git a/app/controllers/api/v1/profiles_controller.rb b/app/controllers/api/v1/profiles_controller.rb index ae1a1fe30..141253d0d 100644 --- a/app/controllers/api/v1/profiles_controller.rb +++ b/app/controllers/api/v1/profiles_controller.rb @@ -38,6 +38,11 @@ class Api::V1::ProfilesController < Api::BaseController head :ok end + def reset_access_token + @user.access_token.regenerate_token + @user.reload + end + private def set_user diff --git a/app/controllers/public/api/v1/portals/articles_controller.rb b/app/controllers/public/api/v1/portals/articles_controller.rb index d07dbcb9d..32a147d34 100644 --- a/app/controllers/public/api/v1/portals/articles_controller.rb +++ b/app/controllers/public/api/v1/portals/articles_controller.rb @@ -1,7 +1,7 @@ class Public::Api::V1::Portals::ArticlesController < Public::Api::V1::Portals::BaseController before_action :ensure_custom_domain_request, only: [:show, :index] before_action :portal - before_action :set_category, except: [:index, :show] + before_action :set_category, except: [:index, :show, :tracking_pixel] before_action :set_article, only: [:show] layout 'portal' @@ -15,6 +15,21 @@ class Public::Api::V1::Portals::ArticlesController < Public::Api::V1::Portals::B def show; end + def tracking_pixel + @article = @portal.articles.find_by(slug: permitted_params[:article_slug]) + return head :not_found unless @article + + @article.increment_view_count if @article.published? + + # Serve the 1x1 tracking pixel with 24-hour private cache + # Private cache bypasses CDN but allows browser caching to prevent duplicate views from same user + expires_in 24.hours, public: false + response.headers['Content-Type'] = 'image/png' + + pixel_path = Rails.public_path.join('assets/images/tracking-pixel.png') + send_file pixel_path, type: 'image/png', disposition: 'inline' + end + private def limit_results @@ -39,7 +54,6 @@ class Public::Api::V1::Portals::ArticlesController < Public::Api::V1::Portals::B def set_article @article = @portal.articles.find_by(slug: permitted_params[:article_slug]) - @article.increment_view_count if @article.published? @parsed_content = render_article_content(@article.content) end diff --git a/app/javascript/dashboard/api/agentBots.js b/app/javascript/dashboard/api/agentBots.js index 6e59f38d3..de887f415 100644 --- a/app/javascript/dashboard/api/agentBots.js +++ b/app/javascript/dashboard/api/agentBots.js @@ -21,6 +21,10 @@ class AgentBotsAPI extends ApiClient { deleteAgentBotAvatar(botId) { return axios.delete(`${this.url}/${botId}/avatar`); } + + resetAccessToken(botId) { + return axios.post(`${this.url}/${botId}/reset_access_token`); + } } export default new AgentBotsAPI(); diff --git a/app/javascript/dashboard/api/auth.js b/app/javascript/dashboard/api/auth.js index dde817866..75e7e2953 100644 --- a/app/javascript/dashboard/api/auth.js +++ b/app/javascript/dashboard/api/auth.js @@ -102,4 +102,8 @@ export default { const urlData = endPoints('resendConfirmation'); return axios.post(urlData.url); }, + resetAccessToken() { + const urlData = endPoints('resetAccessToken'); + return axios.post(urlData.url); + }, }; diff --git a/app/javascript/dashboard/api/endPoints.js b/app/javascript/dashboard/api/endPoints.js index 31337b7fc..5409aac60 100644 --- a/app/javascript/dashboard/api/endPoints.js +++ b/app/javascript/dashboard/api/endPoints.js @@ -51,6 +51,9 @@ const endPoints = { resendConfirmation: { url: '/api/v1/profile/resend_confirmation', }, + resetAccessToken: { + url: '/api/v1/profile/reset_access_token', + }, }; export default page => { diff --git a/app/javascript/dashboard/api/specs/agentBots.spec.js b/app/javascript/dashboard/api/specs/agentBots.spec.js index c89dbfdf5..bf57804c0 100644 --- a/app/javascript/dashboard/api/specs/agentBots.spec.js +++ b/app/javascript/dashboard/api/specs/agentBots.spec.js @@ -9,5 +9,6 @@ describe('#AgentBotsAPI', () => { expect(AgentBotsAPI).toHaveProperty('create'); expect(AgentBotsAPI).toHaveProperty('update'); expect(AgentBotsAPI).toHaveProperty('delete'); + expect(AgentBotsAPI).toHaveProperty('resetAccessToken'); }); }); diff --git a/app/javascript/dashboard/assets/scss/widgets/_tabs.scss b/app/javascript/dashboard/assets/scss/widgets/_tabs.scss index 72a2e6be8..72773de7f 100644 --- a/app/javascript/dashboard/assets/scss/widgets/_tabs.scss +++ b/app/javascript/dashboard/assets/scss/widgets/_tabs.scss @@ -3,7 +3,7 @@ } .tabs--container--with-border { - @apply border-b border-n-weak; + @apply border-b border-b-n-weak; } .tabs--container--compact.tab--chat-type { diff --git a/app/javascript/dashboard/components-next/Conversation/SidepanelSwitch.vue b/app/javascript/dashboard/components-next/Conversation/SidepanelSwitch.vue new file mode 100644 index 000000000..ec3a8d03a --- /dev/null +++ b/app/javascript/dashboard/components-next/Conversation/SidepanelSwitch.vue @@ -0,0 +1,87 @@ + + + + + + + + diff --git a/app/javascript/dashboard/components-next/copilot/CopilotHeader.story.vue b/app/javascript/dashboard/components-next/SidebarActionsHeader.story.vue similarity index 50% rename from app/javascript/dashboard/components-next/copilot/CopilotHeader.story.vue rename to app/javascript/dashboard/components-next/SidebarActionsHeader.story.vue index 78a345093..13d528240 100644 --- a/app/javascript/dashboard/components-next/copilot/CopilotHeader.story.vue +++ b/app/javascript/dashboard/components-next/SidebarActionsHeader.story.vue @@ -1,21 +1,29 @@ - + - + diff --git a/app/javascript/dashboard/components-next/SidebarActionsHeader.vue b/app/javascript/dashboard/components-next/SidebarActionsHeader.vue new file mode 100644 index 000000000..210ddfa0e --- /dev/null +++ b/app/javascript/dashboard/components-next/SidebarActionsHeader.vue @@ -0,0 +1,47 @@ + + + + + + {{ title }} + + + + + + + diff --git a/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue b/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue new file mode 100644 index 000000000..673661a74 --- /dev/null +++ b/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue @@ -0,0 +1,41 @@ + + + + + + + {{ count }} + + + + + + + {{ count }} + + + + + diff --git a/app/javascript/dashboard/components-next/button/ConfirmButton.vue b/app/javascript/dashboard/components-next/button/ConfirmButton.vue new file mode 100644 index 000000000..854d5d452 --- /dev/null +++ b/app/javascript/dashboard/components-next/button/ConfirmButton.vue @@ -0,0 +1,99 @@ + + + + + + + + + + + + + + {{ confirmHint }} + + + + + diff --git a/app/javascript/dashboard/components-next/copilot/Copilot.vue b/app/javascript/dashboard/components-next/copilot/Copilot.vue index 5feb474a6..6fb45c278 100644 --- a/app/javascript/dashboard/components-next/copilot/Copilot.vue +++ b/app/javascript/dashboard/components-next/copilot/Copilot.vue @@ -3,13 +3,15 @@ import { nextTick, ref, watch } from 'vue'; import { useI18n } from 'vue-i18n'; import { useTrack } from 'dashboard/composables'; import { COPILOT_EVENTS } from 'dashboard/helper/AnalyticsHelper/events'; +import { useUISettings } from 'dashboard/composables/useUISettings'; import CopilotInput from './CopilotInput.vue'; import CopilotLoader from './CopilotLoader.vue'; import CopilotAgentMessage from './CopilotAgentMessage.vue'; import CopilotAssistantMessage from './CopilotAssistantMessage.vue'; import ToggleCopilotAssistant from './ToggleCopilotAssistant.vue'; -import Icon from '../icon/Icon.vue'; +import Icon from 'dashboard/components-next/icon/Icon.vue'; +import SidebarActionsHeader from 'dashboard/components-next/SidebarActionsHeader.vue'; const props = defineProps({ supportAgent: { @@ -54,10 +56,6 @@ const useSuggestion = opt => { useTrack(COPILOT_EVENTS.SEND_SUGGESTED); }; -const handleReset = () => { - emit('reset'); -}; - const chatContainer = ref(null); const scrollToBottom = async () => { @@ -82,6 +80,21 @@ const promptOptions = [ }, ]; +const { updateUISettings } = useUISettings(); + +const closeCopilotPanel = () => { + updateUISettings({ + is_copilot_panel_open: false, + is_contact_sidebar_open: false, + }); +}; + +const handleSidebarAction = action => { + if (action === 'reset') { + emit('reset'); + } +}; + watch( [() => props.messages, () => props.isCaptainTyping], () => { @@ -93,6 +106,18 @@ watch( + emit('setAssistant', $event)" /> - - - {{ $t('CAPTAIN.COPILOT.RESET') }} - diff --git a/app/javascript/dashboard/components-next/copilot/CopilotHeader.vue b/app/javascript/dashboard/components-next/copilot/CopilotHeader.vue deleted file mode 100644 index c7a8696f3..000000000 --- a/app/javascript/dashboard/components-next/copilot/CopilotHeader.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - - - - - {{ $t('CAPTAIN.COPILOT.TITLE') }} - - - - - - - - diff --git a/app/javascript/dashboard/components-next/sidebar/Sidebar.vue b/app/javascript/dashboard/components-next/sidebar/Sidebar.vue index e3a533437..0bfcf4142 100644 --- a/app/javascript/dashboard/components-next/sidebar/Sidebar.vue +++ b/app/javascript/dashboard/components-next/sidebar/Sidebar.vue @@ -519,7 +519,7 @@ const menuItems = computed(() => { - + { class="flex flex-col flex-shrink-0 bg-n-solid-1 conversations-list-wrap" :class="[ { hidden: !showConversationList }, - isOnExpandedLayout ? 'basis-full' : 'w-[360px] 2xl:w-[420px]', + isOnExpandedLayout ? 'basis-full' : 'w-[340px] 2xl:w-[412px]', ]" > diff --git a/app/javascript/dashboard/components/ChatListHeader.vue b/app/javascript/dashboard/components/ChatListHeader.vue index 286d6d6c5..b4ce9f342 100644 --- a/app/javascript/dashboard/components/ChatListHeader.vue +++ b/app/javascript/dashboard/components/ChatListHeader.vue @@ -80,16 +80,14 @@ const toggleConversationLayout = () => { {{ pageTitle }} diff --git a/app/javascript/dashboard/components/Snackbar.vue b/app/javascript/dashboard/components/Snackbar.vue index 3a23a15ef..0404c4ba8 100644 --- a/app/javascript/dashboard/components/Snackbar.vue +++ b/app/javascript/dashboard/components/Snackbar.vue @@ -20,7 +20,7 @@ export default { {{ message }} @@ -29,7 +29,7 @@ export default { {{ action.message }} diff --git a/app/javascript/dashboard/components/SnackbarContainer.vue b/app/javascript/dashboard/components/SnackbarContainer.vue index b55d3865c..8c0daebaf 100644 --- a/app/javascript/dashboard/components/SnackbarContainer.vue +++ b/app/javascript/dashboard/components/SnackbarContainer.vue @@ -1,62 +1,72 @@ - - - - + + + + diff --git a/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue b/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue index 01fb46187..26fa7466a 100644 --- a/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue +++ b/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue @@ -48,12 +48,13 @@ useKeyboardEvents(keyboardEvents); - + import { mapGetters } from 'vuex'; -import { useKeyboardEvents } from 'dashboard/composables/useKeyboardEvents'; import BackButton from '../BackButton.vue'; import inboxMixin from 'shared/mixins/inboxMixin'; import InboxName from '../InboxName.vue'; @@ -29,11 +28,7 @@ export default { props: { chat: { type: Object, - default: () => {}, - }, - isContactPanelOpen: { - type: Boolean, - default: false, + default: () => ({}), }, showBackButton: { type: Boolean, @@ -44,15 +39,6 @@ export default { default: false, }, }, - emits: ['contactPanelToggle'], - setup(props, { emit }) { - const keyboardEvents = { - 'Alt+KeyO': { - action: () => emit('contactPanelToggle'), - }, - }; - useKeyboardEvents(keyboardEvents); - }, computed: { ...mapGetters({ currentChat: 'getSelectedChat', @@ -99,13 +85,6 @@ export default { } return this.$t('CONVERSATION.HEADER.SNOOZED_UNTIL_NEXT_REPLY'); }, - contactPanelToggleText() { - return `${ - this.isContactPanelOpen - ? this.$t('CONVERSATION.HEADER.CLOSE') - : this.$t('CONVERSATION.HEADER.OPEN') - } ${this.$t('CONVERSATION.HEADER.DETAILS')}`; - }, inbox() { const { inbox_id: inboxId } = this.chat; return this.$store.getters['inboxes/getInbox'](inboxId); @@ -133,7 +112,7 @@ export default { - + {{ currentContact.name }} @@ -180,19 +160,11 @@ export default { {{ snoozedDisplayText }} - -import { computed, ref } from 'vue'; +import { computed } from 'vue'; import CopilotContainer from '../../copilot/CopilotContainer.vue'; import ContactPanel from 'dashboard/routes/dashboard/conversation/ContactPanel.vue'; -import TabBar from 'dashboard/components-next/tabbar/TabBar.vue'; -import { useI18n } from 'vue-i18n'; import { useMapGetter } from 'dashboard/composables/store'; import { FEATURE_FLAGS } from '../../../featureFlags'; +import { useUISettings } from 'dashboard/composables/useUISettings'; const props = defineProps({ currentChat: { @@ -14,33 +13,8 @@ const props = defineProps({ }, }); -const emit = defineEmits(['toggleContactPanel']); - -const { t } = useI18n(); - const channelType = computed(() => props.currentChat?.meta?.channel || ''); -const CONTACT_TABS_OPTIONS = [ - { key: 'CONTACT', value: 'contact' }, - { key: 'COPILOT', value: 'copilot' }, -]; - -const tabs = computed(() => { - return CONTACT_TABS_OPTIONS.map(tab => ({ - label: t(`CONVERSATION.SIDEBAR.${tab.key}`), - value: tab.value, - })); -}); -const activeTab = ref(0); -const toggleContactPanel = () => { - emit('toggleContactPanel'); -}; - -const handleTabChange = selectedTab => { - activeTab.value = tabs.value.findIndex( - tabItem => tabItem.value === selectedTab.value - ); -}; const currentAccountId = useMapGetter('getCurrentAccountId'); const isFeatureEnabledonAccount = useMapGetter( 'accounts/isFeatureEnabledonAccount' @@ -49,29 +23,37 @@ const isFeatureEnabledonAccount = useMapGetter( const showCopilotTab = computed(() => isFeatureEnabledonAccount.value(currentAccountId.value, FEATURE_FLAGS.CAPTAIN) ); + +const { uiSettings } = useUISettings(); + +const activeTab = computed(() => { + const { + is_contact_sidebar_open: isContactSidebarOpen, + is_copilot_panel_open: isCopilotPanelOpen, + } = uiSettings.value; + + if (isContactSidebarOpen) { + return 0; + } + if (isCopilotPanelOpen) { + return 1; + } + return null; +}); - - - - - - - getUserPermissions(currentUser.value, currentAccountId.value) -); +const { shouldShow, isFeatureFlagEnabled } = usePolicy(); const TABS_CONFIG = { all: { @@ -111,47 +105,67 @@ const TABS_CONFIG = { }, articles: { permissions: [...ROLES, PORTAL_PERMISSIONS], + featureFlag: FEATURE_FLAGS.HELP_CENTER, count: () => mappedArticles.value.length, }, }; const tabs = computed(() => { - const configs = Object.entries(TABS_CONFIG).map(([key, config]) => ({ - key, - name: t(`SEARCH.TABS.${key.toUpperCase()}`), - count: config.count(), - showBadge: key !== 'all', - permissions: config.permissions, - })); - - return filterItemsByPermission( - configs, - userPermissions.value, - item => item.permissions - ); + return Object.entries(TABS_CONFIG) + .map(([key, config]) => ({ + key, + name: t(`SEARCH.TABS.${key.toUpperCase()}`), + count: config.count(), + showBadge: key !== 'all', + permissions: config.permissions, + featureFlag: config.featureFlag, + })) + .filter(config => { + // why the double check, glad you asked. + // Some features are marked as premium features, that means + // the feature will be visible, but a Paywall will be shown instead + // this works for pages and routes, but fails for UI elements like search here + // so we explicitly check if the feature is enabled + return ( + shouldShow(config.featureFlag, config.permissions, null) && + isFeatureFlagEnabled(config.featureFlag) + ); + }); }); const totalSearchResultsCount = computed(() => { - const permissionCounts = { - contacts: { + const permissionCounts = [ + { permissions: [...ROLES, CONTACT_PERMISSIONS], count: () => contacts.value.length, }, - conversations: { + { permissions: [...ROLES, ...CONVERSATION_PERMISSIONS], count: () => conversations.value.length + messages.value.length, }, - articles: { + { permissions: [...ROLES, PORTAL_PERMISSIONS], + featureFlag: FEATURE_FLAGS.HELP_CENTER, count: () => articles.value.length, }, - }; - return filterItemsByPermission( - permissionCounts, - userPermissions.value, - item => item.permissions, - (_, item) => item.count - ).reduce((total, count) => total + count(), 0); + ]; + + return permissionCounts + .filter(config => { + // why the double check, glad you asked. + // Some features are marked as premium features, that means + // the feature will be visible, but a Paywall will be shown instead + // this works for pages and routes, but fails for UI elements like search here + // so we explicitly check if the feature is enabled + return ( + shouldShow(config.featureFlag, config.permissions, null) && + isFeatureFlagEnabled(config.featureFlag) + ); + }) + .map(config => { + return config.count(); + }) + .reduce((sum, count) => sum + count, 0); }); const activeTabIndex = computed(() => { @@ -355,7 +369,9 @@ onUnmounted(() => { {}, - }, }); const { @@ -89,8 +85,6 @@ watch(conversationId, (newConversationId, prevConversationId) => { watch(contactId, getContactDetails); -const onPanelToggle = props.onToggle; - const onDragEnd = () => { dragging.value = false; updateUISettings({ @@ -98,6 +92,13 @@ const onDragEnd = () => { }); }; +const closeContactPanel = () => { + updateUISettings({ + is_contact_sidebar_open: false, + is_copilot_panel_open: false, + }); +}; + onMounted(() => { conversationSidebarItems.value = conversationSidebarItemsOrder.value; getContactDetails(); @@ -107,11 +108,11 @@ onMounted(() => { - + + > + + + diff --git a/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotModal.vue b/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotModal.vue index 97629992a..be4deb337 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotModal.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/agentBots/components/AgentBotModal.vue @@ -228,7 +228,20 @@ const initializeForm = () => { const onCopyToken = async value => { await copyTextToClipboard(value); - useAlert(t('COMPONENTS.CODE.COPY_SUCCESSFUL')); + useAlert(t('AGENT_BOTS.ACCESS_TOKEN.COPY_SUCCESSFUL')); +}; + +const onResetToken = async () => { + const response = await store.dispatch( + 'agentBots/resetAccessToken', + props.selectedBot.id + ); + if (response) { + accessToken.value = response.access_token; + useAlert(t('AGENT_BOTS.ACCESS_TOKEN.RESET_SUCCESS')); + } else { + useAlert(t('AGENT_BOTS.ACCESS_TOKEN.RESET_ERROR')); + } }; const closeModal = () => { @@ -312,7 +325,18 @@ defineExpose({ dialogRef }); > {{ $t('AGENT_BOTS.ACCESS_TOKEN.TITLE') }} - + + diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue index abf547b69..5b0b43fac 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue @@ -1,14 +1,17 @@ @@ -38,7 +45,7 @@ const onClick = () => { > @@ -46,15 +53,28 @@ const onClick = () => { - - {{ $t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.COPY') }} - + + + + diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue index 45a060e05..eedcd21f1 100644 --- a/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue +++ b/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue @@ -181,6 +181,14 @@ export default { await copyTextToClipboard(value); useAlert(this.$t('COMPONENTS.CODE.COPY_SUCCESSFUL')); }, + async resetAccessToken() { + const success = await this.$store.dispatch('resetAccessToken'); + if (success) { + useAlert(this.$t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.RESET_SUCCESS')); + } else { + useAlert(this.$t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.RESET_ERROR')); + } + }, }, }; @@ -281,7 +289,11 @@ export default { ) " > - + diff --git a/app/javascript/dashboard/store/modules/agentBots.js b/app/javascript/dashboard/store/modules/agentBots.js index 3e9931057..bd7bff5f0 100644 --- a/app/javascript/dashboard/store/modules/agentBots.js +++ b/app/javascript/dashboard/store/modules/agentBots.js @@ -172,6 +172,17 @@ export const actions = { commit(types.SET_AGENT_BOT_UI_FLAG, { isDisconnecting: false }); } }, + + resetAccessToken: async ({ commit }, botId) => { + try { + const response = await AgentBotsAPI.resetAccessToken(botId); + commit(types.EDIT_AGENT_BOT, response.data); + return response.data; + } catch (error) { + throwErrorMessage(error); + return null; + } + }, }; export const mutations = { diff --git a/app/javascript/dashboard/store/modules/auth.js b/app/javascript/dashboard/store/modules/auth.js index b790b2a80..f329fb009 100644 --- a/app/javascript/dashboard/store/modules/auth.js +++ b/app/javascript/dashboard/store/modules/auth.js @@ -213,6 +213,16 @@ export const actions = { } }, + resetAccessToken: async ({ commit }) => { + try { + const response = await authAPI.resetAccessToken(); + commit(types.SET_CURRENT_USER, response.data); + return true; + } catch (error) { + return false; + } + }, + resendConfirmation: async () => { try { await authAPI.resendConfirmation(); diff --git a/app/javascript/dashboard/store/modules/specs/agentBots/agentBots.spec.js b/app/javascript/dashboard/store/modules/specs/agentBots/agentBots.spec.js index b2fa47313..168c8f78c 100644 --- a/app/javascript/dashboard/store/modules/specs/agentBots/agentBots.spec.js +++ b/app/javascript/dashboard/store/modules/specs/agentBots/agentBots.spec.js @@ -170,4 +170,21 @@ describe('#actions', () => { ]); }); }); + describe('#resetAccessToken', () => { + it('sends correct actions if API is success', async () => { + const mockResponse = { + data: { ...agentBotRecords[0], access_token: 'new_token_123' }, + }; + axios.post.mockResolvedValue(mockResponse); + const result = await actions.resetAccessToken( + { commit }, + agentBotRecords[0].id + ); + + expect(commit.mock.calls).toEqual([ + [types.EDIT_AGENT_BOT, mockResponse.data], + ]); + expect(result).toBe(mockResponse.data); + }); + }); }); diff --git a/app/javascript/dashboard/store/modules/specs/auth/actions.spec.js b/app/javascript/dashboard/store/modules/specs/auth/actions.spec.js index 3de56b1fe..b5dfebe26 100644 --- a/app/javascript/dashboard/store/modules/specs/auth/actions.spec.js +++ b/app/javascript/dashboard/store/modules/specs/auth/actions.spec.js @@ -228,4 +228,20 @@ describe('#actions', () => { ); }); }); + + describe('#resetAccessToken', () => { + it('sends correct actions if API is success', async () => { + const mockResponse = { + data: { id: 1, name: 'John', access_token: 'new_token_123' }, + headers: { expiry: 581842904 }, + }; + axios.post.mockResolvedValue(mockResponse); + const result = await actions.resetAccessToken({ commit }); + + expect(commit.mock.calls).toEqual([ + [types.SET_CURRENT_USER, mockResponse.data], + ]); + expect(result).toBe(true); + }); + }); }); diff --git a/app/policies/agent_bot_policy.rb b/app/policies/agent_bot_policy.rb index 75c91dbf9..7461f6b2d 100644 --- a/app/policies/agent_bot_policy.rb +++ b/app/policies/agent_bot_policy.rb @@ -22,4 +22,8 @@ class AgentBotPolicy < ApplicationPolicy def avatar? @account_user.administrator? end + + def reset_access_token? + @account_user.administrator? + end end diff --git a/app/views/api/v1/accounts/agent_bots/reset_access_token.json.jbuilder b/app/views/api/v1/accounts/agent_bots/reset_access_token.json.jbuilder new file mode 100644 index 000000000..f647ac383 --- /dev/null +++ b/app/views/api/v1/accounts/agent_bots/reset_access_token.json.jbuilder @@ -0,0 +1 @@ +json.partial! 'api/v1/models/agent_bot', formats: [:json], resource: AgentBotPresenter.new(@agent_bot) diff --git a/app/views/api/v1/profiles/reset_access_token.json.jbuilder b/app/views/api/v1/profiles/reset_access_token.json.jbuilder new file mode 100644 index 000000000..0a4b4f9fa --- /dev/null +++ b/app/views/api/v1/profiles/reset_access_token.json.jbuilder @@ -0,0 +1 @@ +json.partial! 'api/v1/models/user', formats: [:json], resource: @user diff --git a/app/views/layouts/portal.html.erb b/app/views/layouts/portal.html.erb index c4135fd37..6ed0c8201 100644 --- a/app/views/layouts/portal.html.erb +++ b/app/views/layouts/portal.html.erb @@ -73,6 +73,30 @@ By default, it renders: <% end %> + <% if @article.present? %> + + <% end %>
{{ count }}