b42f4fbffd
* fix youtube thumbnails * fix lint issues, update snapshots * Update _videos.scss * Update _videos.scss * revert change to 'YouTubeVideo' to 'YoutubeVideo' * switch back to Youtube instead of YouTube * accessibility fixes -add focus state * fix lint issues * Update youtube_video.test.tsx.snap * remove logic for delaying different aspect ratios. always use 16:9 * Update _videos.scss * fix rounded corners * use css variables for radius * restore attributes from original, remove bottom margin from player to prevent vertical shift * fix issue with margin and nested 'video-div' elements * update class to 'video-playing' * fix linter issues * address copilot review feedback and remove unused css * Update youtube_video.test.tsx * fixed failing test * lint issue fix * Update youtube_video.test.tsx * review feedback changes * Update _videos.scss * update test and snapshot * fix lint issues * add scaling button on hover state back in * feat: Make YouTube video component strings translatable - Add useIntl import and formatMessage usage - Create YouTubePrefix component for internationalized prefix - Update YouTubeThumbnail component to use translatable strings - Add translation IDs: - youtube_video.play.aria_label - youtube_video.thumbnail.alt_text - youtube_video.play_button.aria_label - youtube_video.type Addresses reviewer feedback to make hardcoded strings translatable using React Intl's useIntl hook. Co-authored-by: Matthew Birtch <matthewbirtch@users.noreply.github.com> * fix lint issues * Update en.json * Update youtube_video.test.tsx.snap * remove youtube prefix * fix lint issues * Update youtube_video.test.tsx.snap * fix lint issue --------- Co-authored-by: claude[bot] <209825114+claude[bot]@users.noreply.github.com> Co-authored-by: Matthew Birtch <matthewbirtch@users.noreply.github.com>
Mattermost Web App
This folder contains the client code for the Mattermost web app. It's broken up into multiple packages each of which either contains an area of the app (such as playbooks) or shared logic used across other packages (such as the packages located in the platform directory). For anyone who's used to working in the mattermost/mattermost-webapp repo, most of that is now located in channels.
npm Workspaces
To interact with a workspace using npm, such as to add a dependency or run a script, use the --workspace (or --workspaces) flag. This can be done when using built-in npm commands such as npm add or when running scripts. Those commands should be run from this directory.
# Add a dependency to a single package
npm add react --workspace=playbooks
# Build multiple packages
npm run build --workspace=platform/client --workspace=platform/components
# Test all workspaces
npm test --workspaces
# Clean all workspaces that have a clean script defined
npm run clean --workspaces --if-present
To install dependencies for a workspace, simply run npm install from this folder as you would do normally. Most packages' dependencies will be included in the root node_modules, and all packages' dependencies will appear in the package-lock.json. A node_modules will only be created inside a package if one of its dependencies conflicts with that of another package.
Useful Links
- Developer setup, now included with the Mattermost server developer setup
- Web app developer documentation