Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Welcome message loading indicator #2153

Merged
merged 6 commits into from
Dec 11, 2024

Conversation

kgilpin
Copy link
Contributor

@kgilpin kgilpin commented Dec 10, 2024

Description

This activity modifies the welcome message component to improve the user experience by:

  • Splitting the welcome message into static and dynamic sections
  • Adding a loading indicator while dynamic content is being fetched
  • Including a permanent header with Navie's introduction

The component now handles three states:

  1. Static header (always visible)
  2. Dynamic content (when loaded)
  3. Loading placeholder (when dynamic content is pending)
Screenshot 2024-12-10 at 3 59 04 PM Screenshot 2024-12-10 at 3 59 13 PM

Checklist

  • Implement static header section
  • Add loading placeholder animation
  • Split message prop into static and dynamic parts
  • Add Storybook examples
  • Add tests for loading state

Features

  • navie-chat/welcome-message

Dependencies

Class Dependencies (internal)

  • components/chat/WelcomeMessage.vue

Library Dependencies (external)

  • DOMPurify
  • marked
  • Vue

The component uses CSS animations for the loading indicator and maintains compatibility with existing markdown rendering and sanitization functionality. The loading state uses a skeleton animation pattern common in modern UI design.

Fixes #2151

Fixes #2150

@kgilpin kgilpin requested a review from dustinbyrne December 10, 2024 17:15
@kgilpin kgilpin added the enhancement New feature or request label Dec 10, 2024
@kgilpin kgilpin force-pushed the feat/welcome-message-loading-indicator branch from 8e23c51 to 63ac5bb Compare December 10, 2024 21:08
@kgilpin kgilpin marked this pull request as ready for review December 10, 2024 21:10
@kgilpin kgilpin force-pushed the feat/welcome-message-loading-indicator branch 2 times, most recently from 502335a to e2a3800 Compare December 11, 2024 15:35
…onent

Enhances the welcome message component by adding a static header and a loading state indicator for dynamic content.
@kgilpin kgilpin force-pushed the feat/welcome-message-loading-indicator branch from e2a3800 to 4bd6fda Compare December 11, 2024 15:36
@kgilpin kgilpin merged commit a0b6478 into main Dec 11, 2024
22 of 23 checks passed
@kgilpin kgilpin deleted the feat/welcome-message-loading-indicator branch December 11, 2024 16:54
@appland-release
Copy link
Contributor

🎉 This PR is included in version @appland/navie-v1.38.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

@appland-release
Copy link
Contributor

🎉 This PR is included in version @appland/components-v4.41.0 🎉

The release is available on:

  • @appland/components-v4.41.0
  • GitHub release
  • @appland/components-v4.41.0

Your semantic-release bot 📦🚀

@appland-release
Copy link
Contributor

🎉 This PR is included in version @appland/appmap-v3.178.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request released
Projects
None yet
2 participants