mirror of
https://github.com/owncast/owncast.git
synced 2025-11-03 04:27:18 +08:00
refactor(stories): co-locate stories with components (#2078)
* refactor: move ActionButton component * refactor: move BanUserButton component * refactor: move ChatActionMessage component * refactor: move ChatContainer component * refactor: move AuthModal component * refactor: move BrowserNotifyModal component * refactor: move ChatUserMessage component * refactor: move ChatJoinMessage component * refactor: move ChatTextField component * refactor: move ChatUserBadge component * refactor: move FollowerCollection and SingleFollower components * fix: bad import path * refactor: move FollowModal component * refactor: move Modal component * refactor: move ContentHeader component * refactor: move ChatSystemMessage component * refactor: move Header component * refactor: move Footer component * refactor: move StatusBar component * refactor: move OfflineBanner component * refactor: move OwncastPlayer component * refactor: move IndieAuthModal component * refactor: move SocialLinks component * refactor: move VideoPoster component * refactor: move FollowModal component * refactor: move FediAuthModal.tsx component * refactor: move UserDropdown component * refactor: move ChatSocialMessage component * refactor: move Logo component * refactor: move NotifyReminderPopup component * refactor: move NameChangeModal component * refactor: move FatalErrorStateModal component * refactor: move ChatModeratorNotification component * refactor: move ChatModerationActionMenu and ChatModerationDetailsModal components * refactor: move CustomPageContent component * refactor: move storybook Introduction file * refactor: update storybook story import path * refactor: move storybook preview styles * refactor: move storybook doc pages * refactor: move Color and ImageAsset components * fix: bad import path * fix: bad import path in story file
This commit is contained in:
49
web/components/action-buttons/ActionButton/ActionButton.tsx
Normal file
49
web/components/action-buttons/ActionButton/ActionButton.tsx
Normal file
@ -0,0 +1,49 @@
|
||||
import { Button } from 'antd';
|
||||
import { useState } from 'react';
|
||||
import Modal from '../../ui/Modal/Modal';
|
||||
import { ExternalAction } from '../../../interfaces/external-action';
|
||||
import s from './ActionButton.module.scss';
|
||||
|
||||
interface Props {
|
||||
action: ExternalAction;
|
||||
primary?: boolean;
|
||||
}
|
||||
ActionButton.defaultProps = {
|
||||
primary: true,
|
||||
};
|
||||
|
||||
export default function ActionButton({
|
||||
action: { url, title, description, icon, color, openExternally },
|
||||
primary = false,
|
||||
}: Props) {
|
||||
const [showModal, setShowModal] = useState(false);
|
||||
|
||||
const buttonClicked = () => {
|
||||
if (openExternally) {
|
||||
window.open(url, '_blank');
|
||||
} else {
|
||||
setShowModal(true);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
type={primary ? 'primary' : 'default'}
|
||||
className={`${s.button}`}
|
||||
onClick={buttonClicked}
|
||||
style={{ backgroundColor: color }}
|
||||
>
|
||||
<img src={icon} className={`${s.icon}`} alt={description} />
|
||||
{title}
|
||||
</Button>
|
||||
<Modal
|
||||
title={description || title}
|
||||
url={url}
|
||||
visible={showModal}
|
||||
height="80vh"
|
||||
handleCancel={() => setShowModal(false)}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user