* 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
the absolute positioned mobile action button was attached
to the body causing it to float during scrolling. Now, we wrap
the action buttons inside a relative div so that they are attached
to this div which prevents them from scrolling with page
Fixes#3271
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
* Fix embedded status bar being cut off
This should resolve https://github.com/owncast/owncast/issues/3210.
As recommended in the discussion, flexbox was the way to solve this issue.
The main thing that needed to be addressed though was not applying too many constraints on the OwncastPlayer component just because it was embedded.
By removing the embedded constraints, styling appears to be working as expected.
I'll attach screenshots to the pull request.
* Fix eslint error
This resolves https://github.com/owncast/owncast/issues/3240
From the comments:
This was trickier than expected, but the root of the problem is Firefox will set `#` in the URL bar when `window.location.hash` is set to _any_ string, even a blank string. The morale of the story is, don't mutate base data if you just want to copy values. 😅
Sample of Firefox JavaScript console session that demonstrates the issue:
```javascript
>> window.location.href
"https://github.com/owncast/owncast/issues/3240"
>> const setBlankHash = () => { window.location.hash = ''; };
undefined
>> window.location.hash
""
>> window.location.href
"https://github.com/owncast/owncast/issues/3240"
>> setBlankHash()
undefined
>> // My browser just jumped to the top of the page
undefined
>> window.location.hash
""
>> window.location.href
"https://github.com/owncast/owncast/issues/3240#"
```
* Update ClientTable.tsx
solves: #3339
## Changes
changed owncast/web/components/admin/ClientTable.tsx line 44 `value={selectedKeys[0]})` to `value={selectedKeys[0].toString()} // Convert selectedKeys[0] to string
` as the value attribute expects a value of type string | number | readonly string[]` but previously it was assigned bigint.
* Update ClientTable.tsx
solves: #3339
## Changes
changed owncast/web/components/admin/ClientTable.tsx line 44 `value={selectedKeys[0]})` to `value={selectedKeys[0].toString()} // Convert selectedKeys[0] to string
` as the value attribute expects a value of type `string | number | readonly string[]` but previously it was assigned bigint.
* fix emojis overflowing the chat message
* fix: force ignoring of certain paths?
---------
Co-authored-by: janWilejan <>
Co-authored-by: Gabe Kangas <gabek@real-ity.com>
We add a resize handler to the window when the ChatContainer is created. If a
second ChatContainer is created due to React redrawing, remove the old handler.
Co-authored-by: janWilejan <>
Firefox only breaks at word boundaries by default, meaning we need a horizontal
scrollbar to handle long words like AAAAAAAAAAAAAAAAAAAAAAAAAAAAA.
Co-authored-by: janWilejan <>
* 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
* change chat from a sidebar to a column
Using a 2-column layout prevents the chat scrollbar from overlapping the page
scrollbar. Also, it no longer needs to calculate extra padding for elements.
* remove unused Sidebar.tsx
* fix css for chat column
* re-center "Go to last message" button
* main content column always uses maximum height
* lint
* re-hide scrollbars in mainContent on chromium
* fix chat column width when input is over-full
* chat is only fixed-width in desktop
---------
Co-authored-by: janWilejan <>
* core: remove file extension from emoji name
* web: transform emotes to labels when sending
* chat: replace br with line break
* core: implement emoji cache
* chat: send shortcodes for custom emoji
* chat: correct esling errors
* core: move emoji injection into dedicated function
* emoji: integrate emoji into markdown renderer, fix formatting
* chat protocol: correct golangci-lint findings
* chat field: specify that the contentEditable is an HTMLElement
* admin: mention that emoji should have unique names
* Prettified Code!
* regenerate pack-lock
* chat: correct the emphasis tag, provide fallback for other elements
---------
Co-authored-by: jprjr <jprjr@users.noreply.github.com>
* highlighting: make case-insensitive, support unicode
* highlighting: also highlight simplified/normalized form
* highlighting: use MDN-recommended escape pattern
* chat: simplify input handling
Removes the cursor save/restore functionality.
Removes most key handling.
Allows message to go over limit.
Moves the message length check into SendMessage.
Changes the chat input to change to the max style only when over the limit,
rather than at the limit. Makes it apparent that something is wrong.
Fixes#3121
* Prettified Code!
---------
Co-authored-by: jprjr <jprjr@users.noreply.github.com>
users who want to show repeat usernames can inject the following CSS:
[class^="ChatUserMessage_repeatUser"]{display:flex !important;}
Co-authored-by: janWilejan <>
