feat: Add admin console UI with outreach and onboarding updates#96
Merged
Conversation
Add an admin area, reached from the avatar menu when the signed-in user is an administrator. It has its own left-rail shell with an overview dashboard (KPIs, charts and rankings), demographics, a searchable user table whose rows open a detailed profile, and outreach: a history of sent emails plus a composer with a formatted (markdown) body, a header image, attachments, audience or specific-user targeting, and a live preview of the rendered email. Refresh the marketing surfaces to match the assistant-first direction: the login slides now lead with the assistant and bank integrations, the onboarding flow gets a brand-washed background and illustrated steps with a country step, and the emoji and stripe cards in onboarding and the learning modal are replaced with vector icons and clean surfaces.
Code Review SummaryThis PR introduces a comprehensive Admin Console and refreshes the onboarding/marketing UI. It includes new metrics dashboards, user management, and an outreach campaign tool with markdown support. It also fixes several login-related crashes. 🚀 Key Improvements
💡 Minor Suggestions
|
![sourceant[bot]](https://avatars.githubusercontent.com/in/1161781?s=60&v=4){kind=small}
| } | ||
| }; | ||
|
|
||
| const normalizeUrl = (url: string): string => (/^https?:\/\//i.test(url) ? url : `https://${url}`); |
There was a problem hiding this comment.
The regex ^https?:\/\/ only validates the protocol but not the rest of the URL structure. A user could enter https:// and it would pass.
Suggested change
| const normalizeUrl = (url: string): string => (/^https?:\/\//i.test(url) ? url : `https://${url}`); | |
| const normalizeUrl = (url: string): string => { | |
| if (!url) return ''; | |
| const trimmed = url.trim(); | |
| return /^https?:\/\//i.test(trimmed) ? trimmed : `https://${trimmed}`; | |
| }; |
| <div class="preview__frame"> | ||
| <iframe | ||
| v-if="previewHtml" | ||
| :srcdoc="previewHtml" |
There was a problem hiding this comment.
When using srcdoc in an iframe, it is safer to use the sandbox attribute without allow-scripts unless strictly necessary to prevent XSS from the rendered markdown.
Suggested change
| :srcdoc="previewHtml" | |
| :srcdoc="previewHtml" | |
| class="preview__iframe" | |
| sandbox="allow-same-origin" |
| @@ -0,0 +1,15 @@ | |||
| export default defineNuxtRouteMiddleware(async () => { | |||
There was a problem hiding this comment.
The middleware relies on isAuthenticated which is usually a client-side reactive state. In a SSR context (Nuxt), ensure useAuth handles the initialization properly or wrap this in a client-side check if the API isn't ready.
Suggested change
| export default defineNuxtRouteMiddleware(async () => { | |
| export default defineNuxtRouteMiddleware(async () => { | |
| const { user, isAuthenticated, fetchUser } = useAuth(); | |
| if (process.server) return; | |
| if (!isAuthenticated.value) { | |
| return navigateTo('/login'); | |
| } | |
| if (user.value && typeof user.value.is_admin === 'undefined') { | |
| await fetchUser(); | |
| } | |
| if (!user.value?.is_admin) { | |
| return navigateTo('/dashboard'); | |
| } | |
| }); |
| if (cache) return cache; | ||
| let display: Intl.DisplayNames | null = null; | ||
| try { | ||
| display = new Intl.DisplayNames(['en'], { type: 'region' }); |
There was a problem hiding this comment.
The locale is hardcoded to 'en'. For a localized app, it should use the user's current language preference.
Suggested change
| display = new Intl.DisplayNames(['en'], { type: 'region' }); | |
| const { locale } = useI18n ? useI18n() : { locale: { value: 'en' } }; | |
| display = new Intl.DisplayNames([locale.value], { type: 'region' }); |
Deploying trakli-dev with
|
| Latest commit: |
a6820c7
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://03d5473f.trakli-dev.pages.dev |
| Branch Preview URL: | https://feat-admin-engagement-metric.trakli-dev.pages.dev |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds the admin console UI plus marketing and onboarding refreshes.
Admin (avatar menu, admins only) has its own left-rail shell:
Marketing / design, aligned to the assistant-first direction:
Fixes: the country list (a
.splitprecedence bug) and aconfigs-out-of-scope crash on login.Tests: 405 passing; build green.