Mirroristas/owncast
2
0
Fork 0
mirror of https://github.com/owncast/owncast.git synced 2024-10-10 19:16:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Wire up follower empty state. Closes #1913

Browse Source
This commit is contained in:
Gabe Kangas 2022-11-17 21:30:57 -08:00
parent fa30dea523
commit 18d92dbe9d
No known key found for this signature in database
GPG Key ID: 9A56337728BC81EA
3 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
web/components/ui/Content/Content.tsx
View File

@ -59,9 +59,19 @@ const ChatContainer = dynamic(() =>
import('../../chat/ChatContainer/ChatContainer').then(mod => mod.ChatContainer), import('../../chat/ChatContainer/ChatContainer').then(mod => mod.ChatContainer),
); );
const DesktopContent = ({ name, streamTitle, summary, tags, socialHandles, extraPageContent }) => { const DesktopContent = ({
name,
streamTitle,
summary,
tags,
socialHandles,
extraPageContent,
setShowFollowModal,
}) => {
const aboutTabContent = <CustomPageContent content={extraPageContent} />; const aboutTabContent = <CustomPageContent content={extraPageContent} />;
const followersTabContent = <FollowerCollection name={name} />; const followersTabContent = (
<FollowerCollection name={name} onFollowButtonClick={() => setShowFollowModal(true)} />
);
const items = [ const items = [
{ label: 'About', key: '2', children: aboutTabContent }, { label: 'About', key: '2', children: aboutTabContent },
@ -154,7 +164,9 @@ const MobileContent = ({
<CustomPageContent content={extraPageContent} /> <CustomPageContent content={extraPageContent} />
</> </>
); );
const followersTabContent = <FollowerCollection name={name} />; const followersTabContent = (
<FollowerCollection name={name} onFollowButtonClick={() => setShowFollowModal(true)} />
);
const items = [ const items = [
showChat && { label: 'Chat', key: '0', children: chatContent }, showChat && { label: 'Chat', key: '0', children: chatContent },
@ -367,6 +379,7 @@ export const Content: FC = () => {
tags={tags} tags={tags}
socialHandles={socialHandles} socialHandles={socialHandles}
extraPageContent={extraPageContent} extraPageContent={extraPageContent}
setShowFollowModal={setShowFollowModal}
/> />
)} )}
</div> </div>

8
web/components/ui/followers/FollowerCollection/FollowerCollection.stories.tsx
View File

@ -11,7 +11,13 @@ export default {
const Template: ComponentStory<typeof FollowerCollection> = (args: object) => ( const Template: ComponentStory<typeof FollowerCollection> = (args: object) => (
<RecoilRoot> <RecoilRoot>
<FollowerCollection name="Example stream name" {...args} /> <FollowerCollection
onFollowButtonClick={function (): void {
throw new Error('Function not implemented.');
}}
name="Example stream name"
{...args}
/>
</RecoilRoot> </RecoilRoot>
); );

5
web/components/ui/followers/FollowerCollection/FollowerCollection.tsx
View File

@ -7,9 +7,10 @@ import { FollowButton } from '../../../action-buttons/FollowButton';
export type FollowerCollectionProps = { export type FollowerCollectionProps = {
name: string; name: string;
onFollowButtonClick: () => void;
}; };
export const FollowerCollection: FC<FollowerCollectionProps> = ({ name }) => { export const FollowerCollection: FC<FollowerCollectionProps> = ({ name, onFollowButtonClick }) => {
const ENDPOINT = '/api/followers'; const ENDPOINT = '/api/followers';
const ITEMS_PER_PAGE = 24; const ITEMS_PER_PAGE = 24;
@ -58,7 +59,7 @@ export const FollowerCollection: FC<FollowerCollectionProps> = ({ name }) => {
from the stream, share it with others, and and show your appreciation when it goes live, all from the stream, share it with others, and and show your appreciation when it goes live, all
from your own Fediverse account. from your own Fediverse account.
</p> </p>
<FollowButton /> <FollowButton onClick={onFollowButtonClick} />
</div> </div>
); );