a082cf3a77
* Able to authenticate user against IndieAuth. For #1273 * WIP server indieauth endpoint. For https://github.com/owncast/owncast/issues/1272 * Add migration to remove access tokens from user * Add authenticated bool to user for display purposes * Add indieauth modal and auth flair to display names. For #1273 * Validate URLs and display errors * Renames, cleanups * Handle relative auth endpoint paths. Add error handling for missing redirects. * Disallow using display names in use by registered users. Closes #1810 * Verify code verifier via code challenge on callback * Use relative path to authorization_endpoint * Post-rebase fixes * Use a timestamp instead of a bool for authenticated * Propertly handle and display error in modal * Use auth'ed timestamp to derive authenticated flag to display in chat * Fediverse chat auth via OTP * Increase validity time just in case * Add fediverse auth into auth modal * Text, validation, cleanup updates for fedi auth * Fix typo * Remove unused images * Remove unused file * Add chat display name to auth modal text
74 lines
1.9 KiB
JavaScript
74 lines
1.9 KiB
JavaScript
import { h, Component } from '/js/web_modules/preact.js';
|
|
import htm from '/js/web_modules/htm.js';
|
|
import TabBar from './tab-bar.js';
|
|
import IndieAuthForm from './auth-indieauth.js';
|
|
import FediverseAuth from './auth-fediverse.js';
|
|
|
|
const html = htm.bind(h);
|
|
|
|
export default class ChatSettingsModal extends Component {
|
|
render() {
|
|
const {
|
|
accessToken,
|
|
authenticated,
|
|
federationEnabled,
|
|
username,
|
|
indieAuthEnabled,
|
|
} = this.props;
|
|
|
|
const TAB_CONTENT = [];
|
|
if (indieAuthEnabled) {
|
|
TAB_CONTENT.push({
|
|
label: html`<span style=${{ display: 'flex', alignItems: 'center' }}
|
|
><img
|
|
style=${{
|
|
display: 'inline',
|
|
height: '0.8em',
|
|
marginRight: '5px',
|
|
}}
|
|
src="/img/indieauth.png"
|
|
/>
|
|
IndieAuth</span
|
|
>`,
|
|
content: html`<${IndieAuthForm}}
|
|
accessToken=${accessToken}
|
|
authenticated=${authenticated}
|
|
username=${username}
|
|
/>`,
|
|
});
|
|
}
|
|
|
|
if (federationEnabled) {
|
|
TAB_CONTENT.push({
|
|
label: html`<span style=${{ display: 'flex', alignItems: 'center' }}
|
|
><img
|
|
style=${{
|
|
display: 'inline',
|
|
height: '0.8em',
|
|
marginRight: '5px',
|
|
}}
|
|
src="/img/fediverse-black.png"
|
|
/>
|
|
FediAuth</span
|
|
>`,
|
|
content: html`<${FediverseAuth}}
|
|
authenticated=${authenticated}
|
|
accessToken=${accessToken}
|
|
authenticated=${authenticated}
|
|
username=${username}
|
|
/>`,
|
|
});
|
|
}
|
|
|
|
return html`
|
|
<div class="bg-gray-100 bg-center bg-no-repeat p-5">
|
|
<${TabBar} tabs=${TAB_CONTENT} ariaLabel="Chat settings" />
|
|
<p class="mt-4">
|
|
<b>Note:</b> This is for authentication purposes only, and no personal
|
|
information will be accessed or stored.
|
|
</p>
|
|
</div>
|
|
`;
|
|
}
|
|
}
|