67 Commits

Author SHA1 Message Date
cc9286416c Update storybook to v9 (#4645)
* chore: Update storybook to v9

* Pin next-export-i18n + remove outdated mock library

* Replace old mocking library with MSW

* Resolve knip unused code warnings
2025-10-20 21:26:32 -07:00
51ae467a5a Add localization support for FollowModal component (#4558)
* Initial plan

* Add localization support for FollowModal component

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Update web/components/modals/FollowModal/FollowModal.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update web/components/modals/FollowModal/FollowForm.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: gabek <414923+gabek@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
2025-09-15 21:50:36 -07:00
1cf923a5af Update localization files + references (#4556)
* Initial plan

* Add localization support to NameChangeModal component

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Add NameChangeModal translations to English language file

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* fix(i18n): fix localization keys

* chore(test): add i18n test

* chore(i18n): update translation script

* chore(i18n): reorgnize translation keys and update components

* chore: fix linting warnings

* chore(i18n): update all the language files

* feat(i18n): add last live ago i18n key

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: gabek <414923+gabek@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2025-09-15 19:27:56 -07:00
8eb8bdc18b Stop using empty/whitespace as chat display names (#4553)
* fix(chat): fixes #4522 to stop people from setting invalid display names

* fix(chat): also guard against non-ascii whitespace like non breaking space

* Update web/utils/displayNameValidation.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* fix: handle additional whitespace

* Update web/utils/displayNameValidation.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Javascript formatting autofixes

* fix: deduplicate running of validation

* fix: fix error with useMemo

* Update web/utils/displayNameValidation.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update web/utils/displayNameValidation.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Javascript formatting autofixes

* fix: fix component rendering issue

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Owncast <owncast@owncast.online>
2025-09-15 13:37:39 -07:00
84eaa60ec9 Add static class names to UI elements for easier customization (#4421)
* Initial plan

* Add static class names to UI elements for easier customization

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Add unique DOM element IDs for easier customization targeting

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Remove duplicate class names, keep only IDs for UI element targeting

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Revert chat input field ID to original value

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Remove unnecessary nested spans and revert Button ID to original value

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Standardize ID names to follow owncast-{element-description}-{type} pattern

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: gabek <414923+gabek@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2025-08-07 19:12:28 -07:00
57cd0f974f Update BrowserNotifyModal.tsx to use Localization component (#4444)
* Initial plan

* Update BrowserNotifyModal.tsx to use Localization component

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* Organize BrowserNotifyModal localization keys into namespaces

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* chore: update extracted translations

* Update web/components/modals/BrowserNotifyModal/BrowserNotifyModal.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update web/i18n/en/translation_old.json

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: gabek <414923+gabek@users.noreply.github.com>
Co-authored-by: Owncast default web localizations <owncast@owncast.online>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
2025-07-30 13:02:03 -07:00
07786682b0 Fix error message styling consistency in browser notification modal (#4418)
* Initial plan

* Update BrowserNotifyModal to use Alert component for error styling consistency

Co-authored-by: gabek <414923+gabek@users.noreply.github.com>

* chore: update copilot instructions

* chore: update copilot instructions

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: gabek <414923+gabek@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2025-07-04 22:42:40 -07:00
d1879e74b5 fix errorMessage being set as a raw error type instead of a string (#4333) 2025-05-10 13:20:24 -07:00
87c7571d5c embed screen style adjustments (#4063)
* restyle and relayout embed screen to account for smaller screen displays.
- address https://github.com/owncast/owncast/issues/3683 to address overflow issues
- address https://github.com/owncast/owncast/issues/4051 to move the name of the stream

* Javascript formatting autofixes

* clean up; restore package lock

* accommodate cases when there's no follow option; put follow form on one line, but wrap if need

* clean up

* separate out follow form into separate standalone component to be used in multiple places

* improve follow error styling; rm defaultProps for Modal to get rid of warning

* improve styling of follow form and components for legibility

* prettyify scss

* prettyify scss again

* one more time

* prettify ant file

* simplify layout, center everything

* just use gap

* tweak and lint

* lint, again

---------

Co-authored-by: Owncast <owncast@owncast.online>
2025-01-05 17:28:35 -08:00
d10aa36317 added span tag to text (#3789)
Co-authored-by: Begench <forgithubtobegench@gmail.com>
Co-authored-by: Begench <93909709+begench-g@users.noreply.github.com>
2024-06-25 22:42:22 -07:00
f6045fbd63 Add modal state for browser notifications being denied (#3771) 2024-06-12 21:34:53 -07:00
4f078e1ee4 Migrated Storybook notation from CSF2 to CSF3 (#3412)
* Migrate web action-buttons directory to CSF3 notation

* Migrate web chat directory to CSF3 notation

* Migrate web common directory to CSF3 notation

* Migrate web layout directory to CSF3 notation

* Migrate web modals directory to CSF3 notation

* Migrate web ui directory to CSF3 notation

* Migrate web video directory to CSF3 notation

* Migrate web stories directory to CSF3 notation
2023-11-06 19:35:05 -08:00
3f65099910 Name change: better unicode handling (#3164)
* Name change: better unicode handling

Client-side:

* Changes the NameChangeModal to show text "Over limit" when a proposed display
name is too long.

* Allows names to go over limit to prevent splitting graphemes on input.

Server-side:

* Changes the MakeSafeStringOfLength to count number of unicode code points
instead of string bytes.

* name modal: check that newName is defined before iterating
2023-07-11 10:44:09 -07:00
ccb9b5d075 chore: run stylelint on our css files 2023-06-20 20:58:00 -07:00
6fa576a04a feat: close modal after name change (#3084)
* feat: close modal after name change

* refactor: shortened modal name

* fix: added a no-op for NameChangeModal storybook
2023-06-12 22:54:12 -07:00
447ab10738 feat: add ios specific push notification instructions
Closes #2992
2023-06-05 21:01:51 -07:00
69f217f758 Refactor mobile chat into modal (#3038)
* feat(mobile): refactor mobile chat into modal

- Make page always scrollable
- Move mobile chat into a standalone modal

* fix(test): split out mobile browser test specs

* fix(mobile): force chat button to render on top of footer

* fix: some small updates from review

* fix: hide/show hide chat menu option based on width

* fix: chat button icon getting cut off

* chore(tests): add browser tests for mobile chat modal

* chore(tests): add story for ChatModal component

* fix(test): quiet shellcheck

* fix: remove unused import

* fix(tests): silence storybook linting warning

* fix(ui): reposition chat modal button icon with transform
2023-05-22 18:56:44 -07:00
e50b23d081 Cleanup unused Javascript (#3027)
* chore(js): be stricter about dead code warnings

* chore(js): remove dead code and unused exports

* rebase

* chore: remove unused files

* chore(deps): remove unused prop-types dep

* chore(js): remove unused function

* chore(deps): remove + check unused deps

* chore(js): remove unused exports. Closes #3036
2023-05-20 21:15:25 -07:00
44483a45d3 some webv2 UI polish (#2940)
* style tweaks for Action Button, UserMenu, Modal

* a bunch of misc polish; some around chat

* Prettified Code!

* cleanup

* fix formatting

* Reduce content padding a bit

* some stylesheet cleanup

* fix action button sizing

* Remove action button height completely

---------

Co-authored-by: gingervitis <gingervitis@users.noreply.github.com>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
2023-04-24 10:58:57 -07:00
b3ac4e1a15 fix(js): consolidate url and account validators 2023-04-16 14:32:18 -07:00
dde512fa14 fix(notifications): do not support browser notifications for local servers 2023-04-15 20:20:42 -07:00
74bdab81a3 fix(web): remove extra spacing above headers in modals 2023-04-15 19:59:22 -07:00
1055b1c42d Fix var shadowing 2023-03-12 23:12:39 -07:00
170a3ecde1 Add error boundary to BrowserNotifyModal. For #2811 2023-03-12 23:11:17 -07:00
85d54926ee Add error boundary to Auth modal. For #2811 2023-03-12 23:11:15 -07:00
2489a6520f Increase diffThreshold for test. Closes #2812 2023-03-12 22:10:28 -07:00
de20b2cc11 Increase diff threshold for UI tests: #2292 #2630 #2629 2023-01-30 14:46:34 -08:00
e50a810f23 Add label for display name input. For #1826 2023-01-23 20:29:53 -08:00
6fbd6cbbcf Lazy load every instance of using ant icons. Closes #2583 2023-01-15 22:31:36 -08:00
48e99ff37c Move icons to public directory. Fixes #2573 2023-01-12 13:53:09 -08:00
533d33847c Hide disabled features (#2473)
* Hide/show on notify and fediverse feature disable/enable

* Update browser tests to enable features for testing

* Hide/show features in mobile action menu

* Do not show fediauth option if fediverse features are not enabled.

* Force showing tabs when in Storybook
2022-12-29 16:26:04 -08:00
b21dfaa2b9 Tweak the border of account in follow modal 2022-12-26 20:04:59 -08:00
df5e956801 Replace FediAuthModal placeholder explainer text (#2464)
* Replace placeholder explainer text 

Fixes https://github.com/owncast/owncast/issues/2453

* Prettified Code!

Co-authored-by: silksow <silksow@users.noreply.github.com>
2022-12-17 14:05:11 -08:00
11c4d80e28 Export new url validation functions 2022-12-14 11:52:11 -08:00
c231fd3592 First pass at CSS identifiers + test to verify they are set. For #2193 2022-12-11 21:06:20 -08:00
87f6741bfb Fix styling of notification modal. Closes #2080 2022-12-05 22:11:11 -08:00
4bcfc82a30 Make the push notification modal slightly more correct. Closes #2163 2022-12-05 21:53:14 -08:00
49b4300e2e Replace search button on auth modals. Closes #2377 2022-11-28 22:41:33 -08:00
dab83505a8 Add ID to name change button 2022-11-23 11:41:58 -08:00
56a3f350ee Chat name & color modal (#2347)
* Improve name & color change modal design

* Resend user info after color change

That way the name change dialog shows the correct
color when opening it the next time

* Name change modal: allow overflow of color picker

* Allow submitting form only if button is enabled

* Prettified Code!

* Make button & text input same height

Co-authored-by: xarantolus <xarantolus@users.noreply.github.com>
2022-11-23 10:52:39 -08:00
b9f5b1da19 Fix change name modal story not rendering. Closes #2255 2022-11-06 15:33:21 -08:00
352447e3d4 Web UI frontend automated browser tests (#2223)
* First pass at basic browser tests for #1926

* Run tests against dev web server not go server

* Bundle the web code into the server before running tests

* Move cypress UI tests into its own npm project + add tests

* Add additional tests + wire up with cypress dashboard

* Limit concurrency of workflow jobs

* Temporarily comment out some tests that do not pass in mobile. Will fix later.
2022-11-04 20:04:13 -07:00
e0b7ae5b3a Fix auth modal story not rendering. Closes #2254 2022-10-28 22:22:56 -07:00
125343808d Fix display of auth modal. Re #2262. (#2265) 2022-10-26 14:35:46 -07:00
a526decef4 Refactor use of antd tab component. Closes #2098 2022-10-10 17:54:03 -07:00
80a012a3c7 Add current user object that holds user session values instead of standalone getters. Closes #2050 2022-10-10 16:40:13 -07:00
5742845b7c Fix values in the follow form 2022-10-04 18:43:15 -07:00
765cfa4f5a Added Modal to notify user how to disable notifications (#2154)
* Added Modal to notify user how to disable notifications

* add comment for notification permissions

This adds a comment to describe the behavior of showing the modal on how to disable them if wanted.
Also changed other comment to comply with the new one.

Co-authored-by: Waterdev <wolfistgeil@gmail.com>
2022-10-02 09:42:06 -07:00
129d08144b Fix bad default bool 2022-09-08 22:23:43 -07:00
2774f4260a Add FediAuth modal 2022-09-08 21:44:52 -07:00