scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 03:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: update colors for v4 (#10660)

Browse Source 
Porting changes from https://github.com/chatwoot/chatwoot/pull/10552

---------

Co-authored-by: Pranav <pranav@chatwoot.com>
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: Vishnu Narayanan <vishnu@chatwoot.com>
Co-authored-by: Sojan <sojan@pepalo.com>
Co-authored-by: iamsivin <iamsivin@gmail.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
This commit is contained in:
Shivam Mishra
2025-01-15 17:13:03 +05:30
committed by GitHub
parent a4c0c76fa5
commit 7fd8b4d03a
79 changed files with 660 additions and 795 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
app/javascript/dashboard/components/buttons/ResolveAction.vue
View File

@@ -15,6 +15,8 @@ import {
CMD_RESOLVE_CONVERSATION,
} from 'dashboard/helper/commandbar/events';
import Button from 'dashboard/components-next/button/Button.vue';
const store = useStore();
const getters = useStoreGetters();
const { t } = useI18n();
@@ -41,13 +43,6 @@ const isSnoozed = computed(
() => currentChat.value.status === wootConstants.STATUS_TYPE.SNOOZED
);
const buttonClass = computed(() => {
if (isPending.value) return 'primary';
if (isOpen.value) return 'success';
if (isResolved.value) return 'warning';
return '';
});
const showAdditionalActions = computed(
() => !isPending.value && !isSnoozed.value
);
@@ -138,76 +133,77 @@ useEmitter(CMD_RESOLVE_CONVERSATION, onCmdResolveConversation);
<template>
<div class="relative flex items-center justify-end resolve-actions">
<div class="button-group">
<woot-button
<div
class="rounded-lg shadow button-group outline-1 outline"
:class="!showOpenButton ? 'outline-n-container' : 'outline-transparent'"
>
<Button
v-if="isOpen"
class-names="resolve"
color-scheme="success"
icon="checkmark"
emoji="✅"
:label="t('CONVERSATION.HEADER.RESOLVE_ACTION')"
size="sm"
color="slate"
class="ltr:rounded-r-none rtl:rounded-l-none !outline-0"
:is-loading="isLoading"
@click="onCmdResolveConversation"
>
{{ $t('CONVERSATION.HEADER.RESOLVE_ACTION') }}
</woot-button>
<woot-button
/>
<Button
v-else-if="isResolved"
class-names="resolve"
color-scheme="warning"
icon="arrow-redo"
emoji="👀"
:label="t('CONVERSATION.HEADER.REOPEN_ACTION')"
size="sm"
color="slate"
class="ltr:rounded-r-none rtl:rounded-l-none !outline-0"
:is-loading="isLoading"
@click="onCmdOpenConversation"
>
{{ t('CONVERSATION.HEADER.REOPEN_ACTION') }}
</woot-button>
<woot-button
/>
<Button
v-else-if="showOpenButton"
class-names="resolve"
color-scheme="primary"
icon="person"
:label="t('CONVERSATION.HEADER.OPEN_ACTION')"
size="sm"
color="slate"
:is-loading="isLoading"
@click="onCmdOpenConversation"
>
{{ t('CONVERSATION.HEADER.OPEN_ACTION') }}
</woot-button>
<woot-button
/>
<Button
v-if="showAdditionalActions"
ref="arrowDownButtonRef"
:color-scheme="buttonClass"
icon="i-lucide-chevron-down"
:disabled="isLoading"
icon="chevron-down"
emoji="🔽"
size="sm"
class="ltr:rounded-l-none rtl:rounded-r-none !outline-0"
color="slate"
trailing-icon
@click="openDropdown"
/>
</div>
<div
v-if="showActionsDropdown"
v-on-clickaway="closeDropdown"
class="dropdown-pane dropdown-pane--open left-auto top-[2.625rem] mt-0.5 right-0 max-w-[12.5rem] min-w-[9.75rem]"
class="dropdown-pane dropdown-pane--open left-auto top-full mt-0.5 ltr:right-0 rtl:left-0 max-w-[12.5rem] min-w-[9.75rem]"
>
<WootDropdownMenu class="mb-0">
<WootDropdownItem v-if="!isPending">
<woot-button
variant="clear"
color-scheme="secondary"
size="small"
icon="snooze"
<Button
:label="t('CONVERSATION.RESOLVE_DROPDOWN.SNOOZE_UNTIL')"
ghost
slate
sm
start
icon="i-lucide-alarm-clock-minus"
class="w-full"
@click="() => openSnoozeModal()"
>
{{ t('CONVERSATION.RESOLVE_DROPDOWN.SNOOZE_UNTIL') }}
</woot-button>
/>
</WootDropdownItem>
<WootDropdownItem v-if="!isPending">
<woot-button
variant="clear"
color-scheme="secondary"
size="small"
icon="book-clock"
<Button
:label="t('CONVERSATION.RESOLVE_DROPDOWN.MARK_PENDING')"
ghost
slate
sm
start
icon="i-lucide-circle-dot-dashed"
class="w-full"
@click="() => toggleStatus(wootConstants.STATUS_TYPE.PENDING)"
>
{{ t('CONVERSATION.RESOLVE_DROPDOWN.MARK_PENDING') }}
</woot-button>
/>
</WootDropdownItem>
</WootDropdownMenu>
</div>