62cbeae95f
After entering their account details, new admins land on an **Inbox setup** screen that shows what we've already set up for them and lets them connect their conversation channels without leaving onboarding. It surfaces the auto-created live chat widget (and Help Center on Enterprise), highlights channels detected from their website, and offers a **View all** dialog to connect any supported channel inline. ### Channel status | Channel | How it connects | Status | PR | |---|---|---|---| | Live chat (Website) | Auto-created during setup | ✅ Done | https://github.com/chatwoot/chatwoot/pull/14314 | | WhatsApp | Meta embedded signup | ✅ Done | https://github.com/chatwoot/chatwoot/pull/14619 | | Facebook | Login + page picker | ✅ Done | https://github.com/chatwoot/chatwoot/pull/14619 | | Instagram | OAuth redirect | ✅ Done | https://github.com/chatwoot/chatwoot/pull/14568 | | TikTok | OAuth redirect | ✅ Done | https://github.com/chatwoot/chatwoot/pull/14569 | | LINE | Inline credential form | ✅ Done | — | | Telegram | Inline credential form | ✅ Done | — | | Gmail / Outlook | OAuth (email) | ⚠️ Disabled — coming in a follow-up | https://github.com/chatwoot/chatwoot/pull/14567 | | SMS / API / Voice / Other email | — | ⛔ Unavailable | — | --------- Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
55 lines
1.4 KiB
Vue
55 lines
1.4 KiB
Vue
<script setup>
|
|
import Icon from 'dashboard/components-next/icon/Icon.vue';
|
|
|
|
defineProps({
|
|
title: { type: String, required: true },
|
|
icon: { type: String, required: true },
|
|
bare: { type: Boolean, default: false },
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="mb-5">
|
|
<!-- Section header with icon + triangles -->
|
|
<div class="flex items-center gap-4 mb-3 -ms-12">
|
|
<div class="flex flex-col items-center z-10 flex-shrink-0">
|
|
<svg
|
|
width="6"
|
|
height="5"
|
|
viewBox="0 0 6 5"
|
|
fill="none"
|
|
class="text-n-slate-5"
|
|
>
|
|
<path d="M3 0L6 5H0L3 0Z" fill="currentColor" />
|
|
</svg>
|
|
<div
|
|
class="flex items-center justify-center w-8 h-8 rounded-lg bg-n-solid-1 border border-n-weak"
|
|
>
|
|
<Icon :icon="icon" class="size-4 text-n-slate-11" />
|
|
</div>
|
|
<svg
|
|
width="6"
|
|
height="5"
|
|
viewBox="0 0 6 5"
|
|
fill="none"
|
|
class="text-n-slate-5"
|
|
>
|
|
<path d="M3 5L0 0H6L3 5Z" fill="currentColor" />
|
|
</svg>
|
|
</div>
|
|
<span class="text-heading-3 text-n-slate-12">
|
|
{{ title }}
|
|
</span>
|
|
</div>
|
|
|
|
<!-- Card -->
|
|
<div
|
|
v-if="!bare"
|
|
class="border border-n-weak rounded-xl overflow-hidden bg-n-surface-1"
|
|
>
|
|
<slot />
|
|
</div>
|
|
<slot v-else />
|
|
</div>
|
|
</template>
|