mirror of
https://github.com/chatwoot/chatwoot.git
synced 2026-06-04 21:02:35 +08:00
Some checks failed
Frontend Lint & Test / test (push) Has been cancelled
Publish Chatwoot EE docker images / build (linux/amd64, ubuntu-latest) (push) Has been cancelled
Publish Chatwoot EE docker images / build (linux/arm64, ubuntu-22.04-arm) (push) Has been cancelled
Publish Chatwoot CE docker images / build (linux/amd64, ubuntu-latest) (push) Has been cancelled
Publish Chatwoot CE docker images / build (linux/arm64, ubuntu-22.04-arm) (push) Has been cancelled
Run Chatwoot CE spec / lint-backend (push) Has been cancelled
Run Chatwoot CE spec / lint-frontend (push) Has been cancelled
Run Chatwoot CE spec / frontend-tests (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (0, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (1, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (10, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (11, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (12, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (13, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (14, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (15, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (2, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (3, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (4, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (5, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (6, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (7, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (8, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (9, 16) (push) Has been cancelled
Publish Chatwoot EE docker images / merge (push) Has been cancelled
Publish Chatwoot CE docker images / merge (push) Has been cancelled
66 lines
2.0 KiB
Vue
66 lines
2.0 KiB
Vue
<script setup>
|
|
import ChannelIcon from './ChannelIcon.vue';
|
|
import { useChannelBrandIcon } from './provider';
|
|
|
|
const inboxes = [
|
|
{ name: 'API', channel_type: 'Channel::Api' },
|
|
{ name: 'Email', channel_type: 'Channel::Email' },
|
|
{ name: 'Gmail', channel_type: 'Channel::Email', provider: 'google' },
|
|
{ name: 'Outlook', channel_type: 'Channel::Email', provider: 'microsoft' },
|
|
{ name: 'Messenger', channel_type: 'Channel::FacebookPage' },
|
|
{ name: 'Instagram', channel_type: 'Channel::Instagram' },
|
|
{ name: 'Line', channel_type: 'Channel::Line' },
|
|
{ name: 'Telegram', channel_type: 'Channel::Telegram' },
|
|
{ name: 'WhatsApp', channel_type: 'Channel::Whatsapp' },
|
|
{ name: 'TikTok', channel_type: 'Channel::Tiktok' },
|
|
{ name: 'SMS', channel_type: 'Channel::Sms' },
|
|
{ name: 'Twilio SMS', channel_type: 'Channel::TwilioSms' },
|
|
{
|
|
name: 'Twilio WhatsApp',
|
|
channel_type: 'Channel::TwilioSms',
|
|
medium: 'whatsapp',
|
|
},
|
|
{
|
|
name: 'Voice',
|
|
channel_type: 'Channel::TwilioSms',
|
|
voice_enabled: true,
|
|
},
|
|
{ name: 'Website', channel_type: 'Channel::WebWidget' },
|
|
];
|
|
|
|
const brandInboxes = inboxes.filter(inbox => useChannelBrandIcon(inbox).value);
|
|
</script>
|
|
|
|
<template>
|
|
<Story title="Components/Icons/ChannelIcon">
|
|
<Variant title="Glyph (default)">
|
|
<div class="grid grid-cols-4 gap-5">
|
|
<div
|
|
v-for="inbox in inboxes"
|
|
:key="inbox.name"
|
|
class="flex items-center gap-2"
|
|
>
|
|
<ChannelIcon :inbox="inbox" class="size-6 text-n-slate-11" />
|
|
<span>{{ inbox.name }}</span>
|
|
</div>
|
|
</div>
|
|
</Variant>
|
|
<Variant title="Brand icon">
|
|
<div class="grid grid-cols-4 gap-5">
|
|
<div
|
|
v-for="inbox in brandInboxes"
|
|
:key="inbox.name"
|
|
class="flex items-center gap-2"
|
|
>
|
|
<ChannelIcon
|
|
:inbox="inbox"
|
|
use-brand-icon
|
|
class="size-6 text-n-slate-11"
|
|
/>
|
|
<span>{{ inbox.name }}</span>
|
|
</div>
|
|
</div>
|
|
</Variant>
|
|
</Story>
|
|
</template>
|