feat: remove a massive amount of code
This commit is contained in:
parent
3a03185206
commit
69435a5530
|
|
@ -36,7 +36,6 @@ export const Editor = forwardRef<
|
|||
},
|
||||
],
|
||||
handler: async ({ content }) => {
|
||||
console.log('editPost_' + props.order, content, dayjs().unix());
|
||||
props?.onChange?.(content);
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -72,7 +72,6 @@ const Polonto: FC<{
|
|||
const { setMedia, type, closeModal } = props;
|
||||
const user = useUser();
|
||||
|
||||
console.log(user);
|
||||
const features = useMemo(() => {
|
||||
return [
|
||||
...DEFAULT_SECTIONS,
|
||||
|
|
|
|||
|
|
@ -1,11 +1,6 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
|
||||
const Empty: FC = (props) => {
|
||||
return null;
|
||||
};
|
||||
|
||||
export default withProvider(null, Empty, undefined, async (posts) => {
|
||||
export default withProvider(null, undefined, undefined, async (posts) => {
|
||||
if (posts.some((p) => p.length > 4)) {
|
||||
return 'There can be maximum 4 pictures in a post.';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,10 +4,6 @@ import { DiscordDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-setti
|
|||
import { DiscordChannelSelect } from '@gitroom/frontend/components/launches/providers/discord/discord.channel.select';
|
||||
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
|
||||
|
||||
const Empty: FC = () => {
|
||||
return null;
|
||||
};
|
||||
|
||||
const DiscordComponent: FC = () => {
|
||||
const form = useSettings();
|
||||
return (
|
||||
|
|
@ -18,7 +14,7 @@ const DiscordComponent: FC = () => {
|
|||
};
|
||||
export default withProvider(
|
||||
DiscordComponent,
|
||||
Empty,
|
||||
undefined,
|
||||
DiscordDto,
|
||||
undefined,
|
||||
280
|
||||
|
|
|
|||
|
|
@ -1,18 +1,9 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
|
||||
import { Input } from '@gitroom/react/form/input';
|
||||
import { DribbbleTeams } from '@gitroom/frontend/components/launches/providers/dribbble/dribbble.teams';
|
||||
import { DribbbleDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/dribbble.dto';
|
||||
import ImageFile from 'next/image';
|
||||
|
||||
const DribbbleSettings: FC = () => {
|
||||
const { register, control } = useSettings();
|
||||
|
|
@ -23,128 +14,10 @@ const DribbbleSettings: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
const DribbblePreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<ImageFile
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<ImageFile
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<ImageFile
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<ImageFile
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[3px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(
|
||||
DribbbleSettings,
|
||||
DribbblePreview,
|
||||
undefined,
|
||||
DribbbleDto,
|
||||
async ([firstItem, ...otherItems]) => {
|
||||
const isMp4 = firstItem?.find((item) => item.path.indexOf('mp4') > -1);
|
||||
|
|
|
|||
|
|
@ -1,132 +1,3 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import Image from 'next/image';
|
||||
|
||||
const FacebookPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(null, FacebookPreview, undefined, undefined, 63206);
|
||||
export default withProvider(null, undefined, undefined, undefined, 63206);
|
||||
|
|
|
|||
|
|
@ -70,9 +70,11 @@ export const EditorWrapper: FC<{ children: ReactNode }> = ({ children }) => {
|
|||
|
||||
export const withProvider = (
|
||||
SettingsComponent: FC | null,
|
||||
PreviewComponent: FC,
|
||||
CustomPreviewComponent?: FC<{maximumCharacters?: number}>,
|
||||
dto?: any,
|
||||
checkValidity?: (value: Array<Array<{path: string}>>) => Promise<string|true>,
|
||||
checkValidity?: (
|
||||
value: Array<Array<{ path: string }>>
|
||||
) => Promise<string | true>,
|
||||
maximumCharacters?: number
|
||||
) => {
|
||||
return (props: {
|
||||
|
|
@ -89,8 +91,11 @@ export const withProvider = (
|
|||
const existingData = useExistingData();
|
||||
const { integration, date } = useIntegration();
|
||||
useCopilotReadable({
|
||||
description: integration?.type === 'social' ? 'force content always in MD format' : 'force content always to be fit to social media',
|
||||
value: ''
|
||||
description:
|
||||
integration?.type === 'social'
|
||||
? 'force content always in MD format'
|
||||
: 'force content always to be fit to social media',
|
||||
value: '',
|
||||
});
|
||||
const [editInPlace, setEditInPlace] = useState(!!existingData.integration);
|
||||
const [InPlaceValue, setInPlaceValue] = useState<
|
||||
|
|
@ -116,11 +121,15 @@ export const withProvider = (
|
|||
}, [SettingsComponent]);
|
||||
|
||||
// in case there is an error on submit, we change to the settings tab for the specific provider
|
||||
useMoveToIntegrationListener([props.id], true, ({identifier, toPreview}) => {
|
||||
if (identifier === props.id) {
|
||||
setShowTab(toPreview ? 1 : 2);
|
||||
useMoveToIntegrationListener(
|
||||
[props.id],
|
||||
true,
|
||||
({ identifier, toPreview }) => {
|
||||
if (identifier === props.id) {
|
||||
setShowTab(toPreview ? 1 : 2);
|
||||
}
|
||||
}
|
||||
});
|
||||
);
|
||||
|
||||
// this is a smart function, it updates the global value without updating the states (too heavy) and set the settings validation
|
||||
const form = useValues(
|
||||
|
|
@ -234,8 +243,12 @@ export const withProvider = (
|
|||
}, [props.value, editInPlace]);
|
||||
|
||||
useCopilotAction({
|
||||
name: editInPlace ? 'switchToGlobalEdit' : `editInPlace_${integration?.identifier}`,
|
||||
description: editInPlace ? 'Switch to global editing' : `Edit only ${integration?.identifier} this, if you want a different identifier, you have to use setSelectedIntegration first`,
|
||||
name: editInPlace
|
||||
? 'switchToGlobalEdit'
|
||||
: `editInPlace_${integration?.identifier}`,
|
||||
description: editInPlace
|
||||
? 'Switch to global editing'
|
||||
: `Edit only ${integration?.identifier} this, if you want a different identifier, you have to use setSelectedIntegration first`,
|
||||
handler: async () => {
|
||||
await changeToEditor();
|
||||
},
|
||||
|
|
@ -281,7 +294,11 @@ export const withProvider = (
|
|||
secondary={showTab !== 1}
|
||||
onClick={changeToEditor}
|
||||
>
|
||||
{editInPlace ? 'Edit globally' : `Edit only ${integration?.name} (${capitalize(integration?.identifier.replace('-', ' '))})`}
|
||||
{editInPlace
|
||||
? 'Edit globally'
|
||||
: `Edit only ${integration?.name} (${capitalize(
|
||||
integration?.identifier.replace('-', ' ')
|
||||
)})`}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -292,7 +309,8 @@ export const withProvider = (
|
|||
<div className="flex flex-col gap-[20px]">
|
||||
{!existingData?.integration && (
|
||||
<div className="bg-red-800">
|
||||
You are now editing only {integration?.name} ({capitalize(integration?.identifier.replace('-', ' '))})
|
||||
You are now editing only {integration?.name} (
|
||||
{capitalize(integration?.identifier.replace('-', ' '))})
|
||||
</div>
|
||||
)}
|
||||
{InPlaceValue.map((val, index) => (
|
||||
|
|
@ -384,7 +402,7 @@ export const withProvider = (
|
|||
document.querySelector('#renderEditor')!
|
||||
)}
|
||||
{(showTab === 0 || showTab === 2) && (
|
||||
<div className={clsx("mt-[20px]", showTab !== 2 && 'hidden')}>
|
||||
<div className={clsx('mt-[20px]', showTab !== 2 && 'hidden')}>
|
||||
<Component />
|
||||
</div>
|
||||
)}
|
||||
|
|
@ -400,7 +418,15 @@ export const withProvider = (
|
|||
{(editInPlace ? InPlaceValue : props.value)
|
||||
.map((p) => p.content)
|
||||
.join('').length ? (
|
||||
<GeneralPreviewComponent maximumCharacters={maximumCharacters} />
|
||||
CustomPreviewComponent ? (
|
||||
<CustomPreviewComponent
|
||||
maximumCharacters={maximumCharacters}
|
||||
/>
|
||||
) : (
|
||||
<GeneralPreviewComponent
|
||||
maximumCharacters={maximumCharacters}
|
||||
/>
|
||||
)
|
||||
) : (
|
||||
<>No Content Yet</>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -1,136 +1,8 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import Image from 'next/image';
|
||||
|
||||
const InstagramPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(
|
||||
null,
|
||||
InstagramPreview,
|
||||
undefined,
|
||||
undefined,
|
||||
async ([firstPost, ...otherPosts]) => {
|
||||
if (!firstPost.length) {
|
||||
|
|
|
|||
|
|
@ -1,132 +1,3 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import Image from 'next/image';
|
||||
|
||||
const LinkedinPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage src={mediaDir.set(image.path)} autoplay={true} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(null, LinkedinPreview, undefined, undefined, 1300);
|
||||
export default withProvider(null, undefined, undefined, undefined, 1300);
|
||||
|
|
|
|||
|
|
@ -1,8 +1,3 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
|
||||
const Empty: FC = (props) => {
|
||||
return null;
|
||||
};
|
||||
|
||||
export default withProvider(null, Empty, undefined, undefined);
|
||||
export default withProvider(null, undefined, undefined, undefined);
|
||||
|
|
|
|||
|
|
@ -1,19 +1,10 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
|
||||
import { PinterestBoard } from '@gitroom/frontend/components/launches/providers/pinterest/pinterest.board';
|
||||
import { PinterestSettingsDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/pinterest.dto';
|
||||
import { Input } from '@gitroom/react/form/input';
|
||||
import { ColorPicker } from '@gitroom/react/form/color.picker';
|
||||
import ImageFile from 'next/image';
|
||||
|
||||
const PinterestSettings: FC = () => {
|
||||
const { register, control } = useSettings();
|
||||
|
|
@ -30,128 +21,10 @@ const PinterestSettings: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
const PinterestPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<ImageFile
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<ImageFile
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<ImageFile
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<ImageFile
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[3px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(
|
||||
PinterestSettings,
|
||||
PinterestPreview,
|
||||
undefined,
|
||||
PinterestSettingsDto,
|
||||
async ([firstItem, ...otherItems]) => {
|
||||
const isMp4 = firstItem?.find((item) => item.path.indexOf('mp4') > -1);
|
||||
|
|
|
|||
|
|
@ -4,10 +4,6 @@ import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.v
|
|||
import { SlackChannelSelect } from '@gitroom/frontend/components/launches/providers/slack/slack.channel.select';
|
||||
import { SlackDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/slack.dto';
|
||||
|
||||
const Empty: FC = () => {
|
||||
return null;
|
||||
};
|
||||
|
||||
const SlackComponent: FC = () => {
|
||||
const form = useSettings();
|
||||
return (
|
||||
|
|
@ -18,7 +14,7 @@ const SlackComponent: FC = () => {
|
|||
};
|
||||
export default withProvider(
|
||||
SlackComponent,
|
||||
Empty,
|
||||
undefined,
|
||||
SlackDto,
|
||||
undefined,
|
||||
280
|
||||
|
|
|
|||
|
|
@ -1,138 +1,10 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import Image from 'next/image';
|
||||
|
||||
const ThreadsPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(
|
||||
null,
|
||||
ThreadsPreview,
|
||||
undefined,
|
||||
async ([firstPost, ...otherPosts]) => {
|
||||
undefined,
|
||||
async () => {
|
||||
return true;
|
||||
},
|
||||
500
|
||||
|
|
|
|||
|
|
@ -1,17 +1,8 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import { TikTokDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/tiktok.dto';
|
||||
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
|
||||
import { Select } from '@gitroom/react/form/select';
|
||||
import Image from 'next/image';
|
||||
|
||||
const privacyLevel = [
|
||||
{
|
||||
|
|
@ -137,128 +128,9 @@ const TikTokSettings: FC = () => {
|
|||
);
|
||||
};
|
||||
|
||||
const TikTokPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(
|
||||
TikTokSettings,
|
||||
TikTokPreview,
|
||||
undefined,
|
||||
TikTokDto,
|
||||
async (items) => {
|
||||
const [firstItems] = items;
|
||||
|
|
|
|||
|
|
@ -1,108 +1,5 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import localFont from 'next/font/local';
|
||||
import clsx from 'clsx';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
|
||||
const chirp = localFont({
|
||||
src: [
|
||||
{
|
||||
path: './fonts/Chirp-Regular.woff2',
|
||||
weight: '400',
|
||||
style: 'normal',
|
||||
},
|
||||
{
|
||||
path: './fonts/Chirp-Bold.woff2',
|
||||
weight: '700',
|
||||
style: 'normal',
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const XPreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
specialFunc: (text: string) => {
|
||||
return text.slice(0, 280);
|
||||
},
|
||||
});
|
||||
|
||||
return (
|
||||
<div className={clsx('w-[555px] px-[16px]', chirp.className)}>
|
||||
<div className="w-full h-full relative flex flex-col">
|
||||
{newValues.map((value, index) => (
|
||||
<div
|
||||
key={`tweet_${index}`}
|
||||
style={{}}
|
||||
className={clsx(
|
||||
`flex gap-[8px] relative`,
|
||||
index === newValues.length - 1 ? 'pb-[12px]' : 'pb-[24px]'
|
||||
)}
|
||||
>
|
||||
<div className="w-[40px] flex flex-col items-center">
|
||||
<img
|
||||
src={integration?.picture}
|
||||
alt="x"
|
||||
className="rounded-full relative z-[2]"
|
||||
/>
|
||||
{index !== topValue.length - 1 && (
|
||||
<div className="flex-1 w-[2px] h-[calc(100%-10px)] bg-customColor25 absolute top-[10px] z-[1]" />
|
||||
)}
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col gap-[4px]">
|
||||
<div className="flex">
|
||||
<div className="h-[22px] text-[15px] font-[700]">
|
||||
{integration?.name}
|
||||
</div>
|
||||
<div className="text-[15px] text-customColor26 mt-[1px] ml-[2px]">
|
||||
<svg
|
||||
viewBox="0 0 22 22"
|
||||
aria-label="Verified account"
|
||||
role="img"
|
||||
className="max-w-[20px] max-h-[20px] fill-current h-[1.25em]"
|
||||
data-testid="icon-verified"
|
||||
>
|
||||
<g>
|
||||
<path d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"></path>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<div className="text-[15px] font-[400] text-customColor27 ml-[4px]">
|
||||
@username
|
||||
</div>
|
||||
</div>
|
||||
<pre className={clsx(chirp.className, 'text-wrap')}>
|
||||
{value.text}
|
||||
</pre>
|
||||
{!!value?.images?.length && (
|
||||
<div className="w-full h-[270px] rounded-[16px] flex overflow-hidden mt-[12px]">
|
||||
{value.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
className="flex-1"
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(null, XPreview, undefined, async (posts) => {
|
||||
export default withProvider(null, undefined, undefined, async (posts) => {
|
||||
if (posts.some(p => p.length > 4)) {
|
||||
return 'There can be maximum 4 pictures in a post.';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,20 +1,11 @@
|
|||
import { FC } from 'react';
|
||||
import { withProvider } from '@gitroom/frontend/components/launches/providers/high.order.provider';
|
||||
import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
|
||||
import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
|
||||
import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
|
||||
import {
|
||||
afterLinkedinCompanyPreventRemove,
|
||||
linkedinCompanyPreventRemove,
|
||||
} from '@gitroom/helpers/utils/linkedin.company.prevent.remove';
|
||||
import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
|
||||
import { YoutubeSettingsDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/youtube.settings.dto';
|
||||
import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values';
|
||||
import { Input } from '@gitroom/react/form/input';
|
||||
import { MediumTags } from '@gitroom/frontend/components/launches/providers/medium/medium.tags';
|
||||
import { MediaComponent } from '@gitroom/frontend/components/media/media.component';
|
||||
import { Select } from '@gitroom/react/form/select';
|
||||
import Image from 'next/image';
|
||||
|
||||
const type = [
|
||||
{ label: 'Public', value: 'public' },
|
||||
|
|
@ -48,128 +39,10 @@ const YoutubeSettings: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
const YoutubePreview: FC = (props) => {
|
||||
const { value: topValue, integration } = useIntegration();
|
||||
const mediaDir = useMediaDirectory();
|
||||
const newValues = useFormatting(topValue, {
|
||||
removeMarkdown: true,
|
||||
saveBreaklines: true,
|
||||
beforeSpecialFunc: (text: string) => {
|
||||
return linkedinCompanyPreventRemove(text);
|
||||
},
|
||||
specialFunc: (text: string) => {
|
||||
return afterLinkedinCompanyPreventRemove(text.slice(0, 280));
|
||||
},
|
||||
});
|
||||
|
||||
const [firstPost, ...morePosts] = newValues;
|
||||
if (!firstPost) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-[8px] flex flex-col gap-[8px] border border-black/90 w-[555px] pt-[12px] pl-[16px] pb-[12px] pr-[40px] bg-white text-black font-['helvetica']">
|
||||
<div className="flex gap-[8px]">
|
||||
<div className="w-[48px] h-[48px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col leading-[16px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">1m</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<pre
|
||||
className="font-['helvetica'] text-[14px] font-[400] text-wrap"
|
||||
dangerouslySetInnerHTML={{ __html: firstPost?.text }}
|
||||
/>
|
||||
|
||||
{!!firstPost?.images?.length && (
|
||||
<div className="-ml-[16px] -mr-[40px] flex-1 h-[555px] flex overflow-hidden mt-[12px] gap-[2px]">
|
||||
{firstPost.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
className="flex-1"
|
||||
target="_blank"
|
||||
>
|
||||
<VideoOrImage autoplay={true} src={mediaDir.set(image.path)} />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{morePosts.map((p, index) => (
|
||||
<div className="flex gap-[8px]" key={index}>
|
||||
<div className="w-[40px] h-[40px] relative">
|
||||
<Image
|
||||
width={48}
|
||||
height={48}
|
||||
src={integration?.picture!}
|
||||
alt="x"
|
||||
className="rounded-full w-full h-full relative z-[2]"
|
||||
/>
|
||||
<Image
|
||||
width={24}
|
||||
height={24}
|
||||
src={`/icons/platforms/${integration?.identifier!}.png`}
|
||||
alt="x"
|
||||
className="rounded-full absolute -right-[5px] -bottom-[5px] z-[2]"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-1 flex flex-col leading-[16px] bg-customColor33 w-full pt-[8px] pr-[64px] pl-[12px] pb-[8px] rounded-[8px]">
|
||||
<div className="text-[14px] font-[600]">{integration?.name}</div>
|
||||
<div className="text-[12px] font-[400] text-black/60">
|
||||
CEO @ Gitroom
|
||||
</div>
|
||||
<div className="text-[14px] mt-[8px] font-[400] text-black/90">
|
||||
{p.text}
|
||||
</div>
|
||||
|
||||
{!!p?.images?.length && (
|
||||
<div className="w-full h-[120px] flex overflow-hidden mt-[12px] gap-[3px]">
|
||||
{p.images.map((image, index) => (
|
||||
<a
|
||||
key={`image_${index}`}
|
||||
href={mediaDir.set(image.path)}
|
||||
target="_blank"
|
||||
>
|
||||
<div className="w-[120px] h-full">
|
||||
<VideoOrImage
|
||||
autoplay={true}
|
||||
src={mediaDir.set(image.path)}
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default withProvider(
|
||||
YoutubeSettings,
|
||||
YoutubePreview,
|
||||
undefined,
|
||||
YoutubeSettingsDto,
|
||||
async (items) => {
|
||||
const [firstItems] = items;
|
||||
|
|
|
|||
|
|
@ -10,7 +10,6 @@ const ModeComponent = () => {
|
|||
}, [mode]);
|
||||
|
||||
useEffect(() => {
|
||||
console.log(mode);
|
||||
document.body.classList.remove('dark', 'light');
|
||||
document.body.classList.add(mode);
|
||||
}, [mode]);
|
||||
|
|
|
|||
|
|
@ -61,7 +61,6 @@ export class StarsService {
|
|||
...new Set([...Object.keys(loadAllStars), ...Object.keys(loadAllForks)]),
|
||||
];
|
||||
|
||||
console.log(allDates);
|
||||
const sortedArray = allDates.sort(
|
||||
(a, b) => dayjs(a).unix() - dayjs(b).unix()
|
||||
);
|
||||
|
|
|
|||
|
|
@ -118,8 +118,6 @@ export class DiscordProvider extends SocialAbstract implements SocialProvider {
|
|||
})
|
||||
).json();
|
||||
|
||||
console.log(list);
|
||||
|
||||
return list
|
||||
.filter((p: any) => p.type === 0 || p.type === 15)
|
||||
.map((p: any) => ({
|
||||
|
|
|
|||
|
|
@ -174,7 +174,6 @@ export class FacebookProvider extends SocialAbstract implements SocialProvider {
|
|||
let finalId = '';
|
||||
let finalUrl = '';
|
||||
if ((firstPost?.media?.[0]?.path?.indexOf('mp4') || -2) > -1) {
|
||||
console.log('mp4');
|
||||
const { id: videoId, permalink_url, ...all } = await (
|
||||
await this.fetch(
|
||||
`https://graph.facebook.com/v20.0/${id}/videos?access_token=${accessToken}&fields=id,permalink_url`,
|
||||
|
|
|
|||
|
|
@ -359,8 +359,6 @@ export class InstagramProvider
|
|||
)
|
||||
).json();
|
||||
|
||||
console.log(all);
|
||||
|
||||
return (
|
||||
data?.map((d: any) => ({
|
||||
label: d.title,
|
||||
|
|
|
|||
|
|
@ -113,7 +113,7 @@ export class ThreadsProvider extends SocialAbstract implements SocialProvider {
|
|||
`https://graph.threads.net/v1.0/${mediaContainerId}?fields=status,error_message&access_token=${accessToken}`
|
||||
)
|
||||
).json();
|
||||
console.log(status, error_message);
|
||||
|
||||
if (status === 'ERROR') {
|
||||
throw new Error(id);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -177,8 +177,6 @@ export class YoutubeProvider extends SocialAbstract implements SocialProvider {
|
|||
},
|
||||
});
|
||||
|
||||
console.log(all);
|
||||
|
||||
if (settings?.thumbnail?.path) {
|
||||
try {
|
||||
const allb = await youtubeClient.thumbnails.set({
|
||||
|
|
@ -194,7 +192,6 @@ export class YoutubeProvider extends SocialAbstract implements SocialProvider {
|
|||
},
|
||||
});
|
||||
|
||||
console.log(allb);
|
||||
} catch (err: any) {
|
||||
if (
|
||||
err.response?.data?.error?.errors?.[0]?.domain ===
|
||||
|
|
@ -203,7 +200,6 @@ export class YoutubeProvider extends SocialAbstract implements SocialProvider {
|
|||
throw 'Your account is not verified, we have uploaded your video but we could not set the thumbnail. Please verify your account and try again.';
|
||||
}
|
||||
|
||||
console.log(JSON.stringify(err?.response?.data, null, 2));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -230,7 +226,6 @@ export class YoutubeProvider extends SocialAbstract implements SocialProvider {
|
|||
err.response?.data?.error?.errors?.[0]?.reason ===
|
||||
'youtubeSignupRequired'
|
||||
) {
|
||||
console.log('nevo david!');
|
||||
throw 'You have to link your youtube account to your google account first.';
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -69,7 +69,6 @@ export class OpenaiService {
|
|||
']'
|
||||
);
|
||||
} catch (e) {
|
||||
console.log(content);
|
||||
return [];
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue