Skip to content

Feat/UI redesign p3#23

Merged
ailuckly merged 5 commits into
developfrom
feat/ui-redesign-p3
May 5, 2026
Merged

Feat/UI redesign p3#23
ailuckly merged 5 commits into
developfrom
feat/ui-redesign-p3

Conversation

@ailuckly
Copy link
Copy Markdown
Owner

@ailuckly ailuckly commented May 5, 2026

feat(ui): P3 frontend redesign and chat voice workspace

Summary

This PR delivers the P3 frontend redesign pass and supporting cleanup for the VocaTa web experience.

Major changes:

  • Rebuilds the web visual foundation with refreshed theme tokens, logo usage, shell layout, and page-level
    styling.
  • Redesigns discovery, login, profile, settings, sidebar, and chat-related screens for a brighter, more
    professional product direction.
  • Updates chat UI components, including composer, message list, stage header, and immersive voice call panel
    wiring.
  • Adds deterministic SVG avatar fallback handling for missing or broken role avatars.
  • Updates dependency lockfiles and includes the existing dependency security cleanup commit.
  • Fixes Qiniu upload configuration so missing qiniu.region falls back to SDK auto-region instead of throwing a
    null dereference.
  • Adds .gitignore coverage for local agent files, worktrees, virtualenvs, backend IDE/build output, and
    generated local avatar assets.

Scope

Frontend:

  • vocata-web/src/assets/styles/theme.css
  • vocata-web/src/layouts/BasicLayout.vue
  • vocata-web/src/components/shell/AppSidebar.vue
  • vocata-web/src/views/SearchRole.vue
  • vocata-web/src/views/LoginPage.vue
  • vocata-web/src/views/ProfilePage.vue
  • vocata-web/src/views/SettingsPage.vue
  • vocata-web/src/views/ChatPage.vue
  • vocata-web/src/components/chat/*
  • vocata-web/src/utils/avatar.ts

Backend:

  • vocata-server/src/main/java/com/vocata/file/config/QiniuConfig.java
  • vocata-server/src/test/java/com/vocata/file/config/QiniuConfigTest.java

Repo hygiene:

  • .gitignore

Verification

Passed:

  • cd vocata-web && npm run build

Known verification issue:

  • cd vocata-server && mvn -Dmaven.repo.local=/tmp/juhao_m2repo -Dtest=QiniuConfigTest test
  • This did not reach test execution because Maven failed to resolve spring-boot-maven-plugin:3.1.4 from
    repo.maven.apache.org with Remote host terminated the handshake.

Notes:

  • Vite build reports large chunk warnings for the main bundle and bundled fonts. This is pre-merge follow-up
    material, not a build blocker.
  • Push completed successfully to origin/feat/ui-redesign-p3.
  • GitHub reported existing default-branch dependency vulnerabilities during push.

Critical:
- PostgreSQL JDBC driver: 42.6.0 → 42.7.4
  Fixes SQL injection via line comment generation (CVE-2024-1597)

High (resolved via npm audit fix):
- vocata-web: vite, rollup, lodash-es, flatted, immutable, minimatch
  (0 vulnerabilities after fix)
- vocata-admin: vite, rollup, axios, lodash, lodash-es, tar, flatted,
  immutable (0 vulnerabilities after fix)

Both package-lock.json files regenerated to clear stale transitive
dependency references that were triggering GitHub Dependabot alerts.
VoiceCallPanel: full redesign to immersive fullscreen mode
- Fixed position overlay (z-index 9999) with blurred character
  avatar background (filter: blur(40px) brightness(0.3))
- Center: large 160px avatar with dual pulse-ring animation on
  speaking state, status text + character name below
- Subtitles: toggleable (CC button), user messages as right-aligned
  bubbles, AI messages as left-aligned text with speaker label
- Controls: CC toggle, mute (inverts on muted), hangup (red, 76px,
  rotated phone icon), all with backdrop-filter blur
- Transitions: slide-up enter, fade for subtitles
- New prop: characterAvatar for background + avatar display

ChatPage: added VoiceTranscriptItem type import for voice panel
Ignore local agent/worktree directories, Python virtual environments, backend IDE/build artifacts, and generated avatar assets so they do not leak into PRs.
Handle missing qiniu.region values by using the Qiniu SDK auto region instead of dereferencing null.

Add a focused regression test that constructs UploadManager without an explicit region.
Copilot AI review requested due to automatic review settings May 5, 2026 06:58
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR continues the P3 frontend redesign by updating the chat voice-call experience (immersive panel UI + transcript handling), and includes a small backend robustness fix for Qiniu region configuration with a regression test, plus dependency/ignore-file housekeeping.

Changes:

  • Web: Wire character avatar into the voice call panel and adjust visible voice transcript logic to include in-progress STT/streaming content.
  • Web: Redesign VoiceCallPanel into a full-screen “immersive voice mode” UI with subtitle toggling and updated controls.
  • Server: Make Qiniu region selection null-safe by falling back to Region.autoRegion(), and add a unit test to prevent regressions.

Reviewed changes

Copilot reviewed 5 out of 8 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
vocata-web/src/views/ChatPage.vue Passes characterAvatar into voice panel and adjusts transcript computation to include live STT/streaming snippets.
vocata-web/src/components/chat/VoiceCallPanel.vue Replaces the prior compact panel with an immersive full-screen voice UI, including avatar/background usage and subtitle toggles.
vocata-web/package-lock.json Updates frontend dependency lockfile versions.
vocata-server/src/main/java/com/vocata/file/config/QiniuConfig.java Adds null guard for qiniu.region to avoid NPE and default to SDK auto-region.
vocata-server/src/test/java/com/vocata/file/config/QiniuConfigTest.java Adds a regression test asserting uploadManager() doesn’t throw when region is missing.
vocata-server/pom.xml Bumps PostgreSQL driver version property.
.gitignore Expands ignore rules for local agent/venv/worktree/build outputs and generated avatar assets.
Files not reviewed (1)
  • vocata-web/package-lock.json: Language not supported

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

<!-- Blurred Background -->
<div
class="immersive-bg"
:style="{ backgroundImage: `url(${characterAvatar || '/default-bg.png'})` }"
<div class="avatar-container" :class="{ 'is-speaking': speaking, 'is-muted': muted }">
<div class="pulse-ring"></div>
<div class="pulse-ring delay-1"></div>
<img :src="characterAvatar" class="character-avatar" alt="Character Avatar" />
Remove unused script setup bindings reported by ESLint in the shell, layout, and login page.

Type the generated avatar palette as color pairs so vue-tsc can verify the fallback avatar helper.

Verification: ./scripts/validate-web.sh
@ailuckly ailuckly merged commit 39d7418 into develop May 5, 2026
5 checks passed
@ailuckly ailuckly deleted the feat/ui-redesign-p3 branch May 7, 2026 12:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants