reafctor: normalize component formatting (#2082)
* refactor: move/rename BanUserButton file * refactor: move/rename Chart file * refactor: update generic component filenames to PascalCase * refactor: update config component filenames to PascalCase * refactor: update AdminLayout component filename to PascalCase * refactor: update/move VideoJS component * chore(eslint): disable bad react/require-default-props rule * refactor: normalize ActionButton component * refactor: normalize ActionButtonRow component * refactor: normalize FollowButton component * refactor: normalize NotifyButton component * refactor: normalize ChatActionMessage component * refactor: normalize ChatContainer component * refactor: normalize ChatJoinMessage component * refactor: normalize ChatModerationActionMenu component * refactor: normalize ChatModerationDetailsModal component * refactor: normalize ChatModeratorNotification component * refactor: normalize ChatSocialMessage component * refactor: normalize ChatSystemMessage component * refactor: normalize ChatTextField component * refactor: normalize ChatUserBadge component * refactor: normalize ChatUserMessage component * refactor: normalize ContentHeader component * refactor: normalize OwncastLogo component * refactor: normalize UserDropdown component * chore(eslint): modify react/function-component-definition rule * refactor: normalize CodecSelector component * refactor: update a bunch of functional components using eslint * refactor: update a bunch of functional components using eslint, pt2 * refactor: update a bunch of functional components using eslint, pt3 * refactor: replace all component->component default imports with named imports * refactor: replace all component-stories->component default imports with named imports * refactor: remove default exports from most components * chore(eslint): add eslint config files for the components and pages dirs * fix: use-before-define error in ChatContainer * Fix ChatContainer import * Only process .tsx files in Next builds Co-authored-by: Gabe Kangas <gabek@real-ity.com>
This commit is contained in:
@@ -1,69 +1,64 @@
|
||||
import { Row, Col, Spin, Typography, Button } from 'antd';
|
||||
import React, { useState } from 'react';
|
||||
import React, { FC, useState } from 'react';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import { accessTokenAtom, clientConfigStateAtom } from '../../stores/ClientConfigStore';
|
||||
import {
|
||||
registerWebPushNotifications,
|
||||
saveNotificationRegistration,
|
||||
} from '../../../services/notifications-service';
|
||||
import s from './BrowserNotifyModal.module.scss';
|
||||
import styles from './BrowserNotifyModal.module.scss';
|
||||
import isPushNotificationSupported from '../../../utils/browserPushNotifications';
|
||||
|
||||
const { Title } = Typography;
|
||||
|
||||
function NotificationsNotSupported() {
|
||||
return <div>Browser notifications are not supported in your browser.</div>;
|
||||
}
|
||||
const NotificationsNotSupported = () => (
|
||||
<div>Browser notifications are not supported in your browser.</div>
|
||||
);
|
||||
|
||||
function NotificationsEnabled() {
|
||||
return <div>Notifications enabled</div>;
|
||||
}
|
||||
const NotificationsEnabled = () => <div>Notifications enabled</div>;
|
||||
|
||||
interface PermissionPopupPreviewProps {
|
||||
export type PermissionPopupPreviewProps = {
|
||||
start: () => void;
|
||||
}
|
||||
function PermissionPopupPreview(props: PermissionPopupPreviewProps) {
|
||||
const { start } = props;
|
||||
};
|
||||
|
||||
return (
|
||||
<div id="browser-push-preview-box" className={s.pushPreview}>
|
||||
<div className={s.inner}>
|
||||
<div className={s.title}>{window.location.toString()} wants to</div>
|
||||
<div className={s.permissionLine}>
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M14 12.3333V13H2V12.3333L3.33333 11V7C3.33333 4.93333 4.68667 3.11333 6.66667 2.52667C6.66667 2.46 6.66667 2.4 6.66667 2.33333C6.66667 1.97971 6.80714 1.64057 7.05719 1.39052C7.30724 1.14048 7.64638 1 8 1C8.35362 1 8.69276 1.14048 8.94281 1.39052C9.19286 1.64057 9.33333 1.97971 9.33333 2.33333C9.33333 2.4 9.33333 2.46 9.33333 2.52667C11.3133 3.11333 12.6667 4.93333 12.6667 7V11L14 12.3333ZM9.33333 13.6667C9.33333 14.0203 9.19286 14.3594 8.94281 14.6095C8.69276 14.8595 8.35362 15 8 15C7.64638 15 7.30724 14.8595 7.05719 14.6095C6.80714 14.3594 6.66667 14.0203 6.66667 13.6667"
|
||||
fill="#676670"
|
||||
/>
|
||||
</svg>
|
||||
Show notifications
|
||||
</div>
|
||||
<div className={s.buttonRow}>
|
||||
<Button
|
||||
type="primary"
|
||||
className={s.allow}
|
||||
onClick={() => {
|
||||
start();
|
||||
}}
|
||||
>
|
||||
Allow
|
||||
</Button>
|
||||
<button type="button" className={s.disabled}>
|
||||
Block
|
||||
</button>
|
||||
</div>
|
||||
const PermissionPopupPreview: FC<PermissionPopupPreviewProps> = ({ start }) => (
|
||||
<div id="browser-push-preview-box" className={styles.pushPreview}>
|
||||
<div className={styles.inner}>
|
||||
<div className={styles.title}>{window.location.toString()} wants to</div>
|
||||
<div className={styles.permissionLine}>
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M14 12.3333V13H2V12.3333L3.33333 11V7C3.33333 4.93333 4.68667 3.11333 6.66667 2.52667C6.66667 2.46 6.66667 2.4 6.66667 2.33333C6.66667 1.97971 6.80714 1.64057 7.05719 1.39052C7.30724 1.14048 7.64638 1 8 1C8.35362 1 8.69276 1.14048 8.94281 1.39052C9.19286 1.64057 9.33333 1.97971 9.33333 2.33333C9.33333 2.4 9.33333 2.46 9.33333 2.52667C11.3133 3.11333 12.6667 4.93333 12.6667 7V11L14 12.3333ZM9.33333 13.6667C9.33333 14.0203 9.19286 14.3594 8.94281 14.6095C8.69276 14.8595 8.35362 15 8 15C7.64638 15 7.30724 14.8595 7.05719 14.6095C6.80714 14.3594 6.66667 14.0203 6.66667 13.6667"
|
||||
fill="#676670"
|
||||
/>
|
||||
</svg>
|
||||
Show notifications
|
||||
</div>
|
||||
<div className={styles.buttonRow}>
|
||||
<Button
|
||||
type="primary"
|
||||
className={styles.allow}
|
||||
onClick={() => {
|
||||
start();
|
||||
}}
|
||||
>
|
||||
Allow
|
||||
</Button>
|
||||
<button type="button" className={styles.disabled}>
|
||||
Block
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
</div>
|
||||
);
|
||||
|
||||
export default function BrowserNotifyModal() {
|
||||
export const BrowserNotifyModal = () => {
|
||||
const [error, setError] = useState<string>(null);
|
||||
const accessToken = useRecoilValue(accessTokenAtom);
|
||||
const config = useRecoilValue(clientConfigStateAtom);
|
||||
@@ -120,4 +115,4 @@ export default function BrowserNotifyModal() {
|
||||
</Row>
|
||||
</Spin>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user