Skip to content

Commit 7e1e5f3

Browse files
nevo-davidnevo-david
committed
feat: kick
1 parent bf9ab0f commit 7e1e5f3

File tree

13 files changed

+423
-19
lines changed

13 files changed

+423
-19
lines changed

‎apps/frontend/public/icons/platforms/kick.png‎

14.1 KB
Loading

‎apps/frontend/public/no-picture.jpg‎

-20.9 KB
Loading

‎apps/frontend/src/components/launches/launches.component.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -287,7 +287,7 @@ export const MenuComponent: FC<
287287
</div>
288288
)}
289289
<ImageWithFallback
290-
fallbackSrc={`/icons/platforms/${integration.identifier}.png`}
290+
fallbackSrc={'/no-picture.jpg'}
291291
src={integration.picture || '/no-picture.jpg'}
292292
className="rounded-[8px] min-w-[36px] min-h-[36px]"
293293
alt={integration.identifier}

‎apps/frontend/src/components/new-launch/picks.socials.component.tsx‎

Lines changed: 24 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -27,13 +27,13 @@ export const PicksSocialsComponent: FC<{ toolTip?: boolean }> = ({
2727
}))
2828
);
2929

30-
3130
return (
3231
<div className={clsx('flex', locked && 'opacity-50 pointer-events-none')}>
3332
<div className="flex flex-1">
3433
<div className="innerComponent flex-1 flex">
3534
<div className="flex flex-wrap gap-[12px] flex-1">
36-
{integrations.filter((f) => {
35+
{integrations
36+
.filter((f) => {
3737
if (exising.integration) {
3838
return f.id === exising.integration;
3939
}
@@ -64,20 +64,28 @@ export const PicksSocialsComponent: FC<{ toolTip?: boolean }> = ({
6464
: 'border-[#622FF6]'
6565
)}
6666
>
67-
<Image
68-
src={integration.picture || '/no-picture.jpg'}
69-
className={clsx(
70-
'rounded-full transition-all min-w-[42px] border-[1.5px] min-h-[42px]',
71-
selectedIntegrations.findIndex(
72-
(p) => p.integration.id === integration.id
73-
) === -1
74-
? 'border-transparent'
75-
: 'border-[#000]'
76-
)}
77-
alt={integration.identifier}
78-
width={42}
79-
height={42}
80-
/>
67+
<div
68+
className="rounded-full min-w-[42px] min-h-[42px] bg-contain bg-center bg-no-repeat"
69+
style={{ backgroundImage: `url(/no-picture.jpg)` }}
70+
>
71+
<Image
72+
src={integration.picture || '/no-picture.jpg'}
73+
className={clsx(
74+
'rounded-full transition-all min-w-[42px] border-[1.5px] min-h-[42px]',
75+
selectedIntegrations.findIndex(
76+
(p) => p.integration.id === integration.id
77+
) === -1
78+
? 'border-transparent'
79+
: 'border-[#000]'
80+
)}
81+
onError={(e) => {
82+
e.currentTarget.style.display = 'none';
83+
}}
84+
alt={integration.identifier}
85+
width={42}
86+
height={42}
87+
/>
88+
</div>
8189
{integration.identifier === 'youtube' ? (
8290
<img
8391
src="/icons/platforms/youtube.svg"

‎apps/frontend/src/components/new-launch/providers/kick/kick.channel.select.tsx‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
'use client';
2+
3+
import { FC, useEffect, useState } from 'react';
4+
import { useCustomProviderFunction } from '@gitroom/frontend/components/launches/helpers/use.custom.provider.function';
5+
import { Select } from '@gitroom/react/form/select';
6+
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
7+
import { useT } from '@gitroom/react/translation/get.transation.service.client';
8+
9+
export const KickChannelSelect: FC<{
10+
name: string;
11+
onChange: (event: {
12+
target: {
13+
value: string;
14+
name: string;
15+
};
16+
}) => void;
17+
}> = (props) => {
18+
const { onChange, name } = props;
19+
const t = useT();
20+
const customFunc = useCustomProviderFunction();
21+
const [channels, setChannels] = useState([]);
22+
const { getValues } = useSettings();
23+
const [currentChannel, setCurrentChannel] = useState<string | undefined>();
24+
25+
const onChangeInner = (event: {
26+
target: {
27+
value: string;
28+
name: string;
29+
};
30+
}) => {
31+
setCurrentChannel(event.target.value);
32+
onChange(event);
33+
};
34+
35+
useEffect(() => {
36+
customFunc.get('channels').then((data) => setChannels(data));
37+
const settings = getValues()[props.name];
38+
if (settings) {
39+
setCurrentChannel(settings);
40+
}
41+
}, []);
42+
43+
if (!channels.length) {
44+
return null;
45+
}
46+
47+
return (
48+
<Select
49+
name={name}
50+
label={t('kick_select_channel', 'Select Channel')}
51+
onChange={onChangeInner}
52+
value={currentChannel}
53+
>
54+
<option value="">{t('select_1', '--Select--')}</option>
55+
{channels.map((channel: any) => (
56+
<option key={channel.id} value={channel.id}>
57+
{channel.name}
58+
</option>
59+
))}
60+
</Select>
61+
);
62+
};
63+

‎apps/frontend/src/components/new-launch/providers/kick/kick.provider.tsx‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
'use client';
2+
3+
import {
4+
PostComment,
5+
withProvider,
6+
} from '@gitroom/frontend/components/new-launch/providers/high.order.provider';
7+
import { FC } from 'react';
8+
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
9+
import { KickChannelSelect } from '@gitroom/frontend/components/new-launch/providers/kick/kick.channel.select';
10+
import { KickDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/kick.dto';
11+
12+
const KickComponent: FC = () => {
13+
const form = useSettings();
14+
return (
15+
<div>
16+
<KickChannelSelect {...form.register('broadcasterUserId')} />
17+
</div>
18+
);
19+
};
20+
21+
export default withProvider({
22+
postComment: PostComment.COMMENT,
23+
minimumCharacters: [],
24+
SettingsComponent: KickComponent,
25+
CustomPreviewComponent: undefined,
26+
dto: KickDto,
27+
checkValidity: undefined,
28+
maximumCharacters: 500,
29+
});
30+

‎apps/frontend/src/components/new-launch/providers/show.all.providers.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import DribbbleProvider from '@gitroom/frontend/components/new-launch/providers/
1515
import ThreadsProvider from '@gitroom/frontend/components/new-launch/providers/threads/threads.provider';
1616
import DiscordProvider from '@gitroom/frontend/components/new-launch/providers/discord/discord.provider';
1717
import SlackProvider from '@gitroom/frontend/components/new-launch/providers/slack/slack.provider';
18+
import KickProvider from '@gitroom/frontend/components/new-launch/providers/kick/kick.provider';
1819
import MastodonProvider from '@gitroom/frontend/components/new-launch/providers/mastodon/mastodon.provider';
1920
import BlueskyProvider from '@gitroom/frontend/components/new-launch/providers/bluesky/bluesky.provider';
2021
import LemmyProvider from '@gitroom/frontend/components/new-launch/providers/lemmy/lemmy.provider';
@@ -103,6 +104,10 @@ export const Providers = [
103104
identifier: 'slack',
104105
component: SlackProvider,
105106
},
107+
{
108+
identifier: 'kick',
109+
component: KickProvider,
110+
},
106111
{
107112
identifier: 'mastodon',
108113
component: MastodonProvider,

‎apps/frontend/src/components/new-launch/select.current.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,10 @@ export const SelectCurrent: FC = () => {
9999
>
100100
<IsGlobal id={integration.id} />
101101
<div
102+
{...{
103+
'data-tooltip-id': 'tooltip',
104+
'data-tooltip-content': integration.name,
105+
}}
102106
className={clsx(
103107
'relative w-full h-full rounded-full flex justify-center items-center filter transition-all duration-500'
104108
)}
@@ -109,6 +113,10 @@ export const SelectCurrent: FC = () => {
109113
alt={integration.identifier}
110114
width={26}
111115
height={26}
116+
onError={(e) => {
117+
e.currentTarget.src = '/no-picture.jpg';
118+
e.currentTarget.srcset = '/no-picture.jpg';
119+
}}
112120
/>
113121
{integration.identifier === 'youtube' ? (
114122
<img

‎libraries/nestjs-libraries/src/dtos/posts/providers-settings/all.providers.settings.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { LemmySettingsDto } from '@gitroom/nestjs-libraries/dtos/posts/providers
77
import { DribbbleDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/dribbble.dto';
88
import { DiscordDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/discord.dto';
99
import { SlackDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/slack.dto';
10+
import { KickDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/kick.dto';
1011
import { InstagramDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/instagram.dto';
1112
import { LinkedinDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/linkedin.dto';
1213
import { IsIn } from 'class-validator';
@@ -29,6 +30,7 @@ export type AllProvidersSettings =
2930
| ProviderExtension<'tiktok', TikTokDto>
3031
| ProviderExtension<'discord', DiscordDto>
3132
| ProviderExtension<'slack', SlackDto>
33+
| ProviderExtension<'kick', KickDto>
3234
| ProviderExtension<'x', XDto>
3335
| ProviderExtension<'linkedin', LinkedinDto>
3436
| ProviderExtension<'linkedin-page', LinkedinDto>
@@ -61,6 +63,7 @@ export const allProviders = (setEmpty?: any) => {
6163
{ value: TikTokDto, name: 'tiktok' },
6264
{ value: DiscordDto, name: 'discord' },
6365
{ value: SlackDto, name: 'slack' },
66+
{ value: KickDto, name: 'kick' },
6467
{ value: XDto, name: 'x' },
6568
{ value: LinkedinDto, name: 'linkedin' },
6669
{ value: LinkedinDto, name: 'linkedin-page' },

‎libraries/nestjs-libraries/src/dtos/posts/providers-settings/kick.dto.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { IsDefined, IsString, MinLength } from 'class-validator';
2+
import { JSONSchema } from 'class-validator-jsonschema';
3+
4+
export class KickDto {
5+
@MinLength(1)
6+
@IsDefined()
7+
@IsString()
8+
@JSONSchema({
9+
description: 'Broadcaster user ID to post to',
10+
})
11+
broadcasterUserId: string;
12+
}
13+

0 commit comments

Comments
 (0)