diff --git a/apps/frontend/src/components/launches/helpers/use.custom.provider.function.ts b/apps/frontend/src/components/launches/helpers/use.custom.provider.function.ts index 9e990aad..3b25139d 100644 --- a/apps/frontend/src/components/launches/helpers/use.custom.provider.function.ts +++ b/apps/frontend/src/components/launches/helpers/use.custom.provider.function.ts @@ -16,7 +16,7 @@ export const useCustomProviderFunction = () => { }), }); - if (load.status !== 200 && load.status !== 201) { + if (load.status > 299 && load.status < 200) { throw new Error('Failed to fetch'); } diff --git a/apps/frontend/src/components/launches/providers/tiktok/tiktok.provider.tsx b/apps/frontend/src/components/launches/providers/tiktok/tiktok.provider.tsx index 3dc6a203..9ec2c06d 100644 --- a/apps/frontend/src/components/launches/providers/tiktok/tiktok.provider.tsx +++ b/apps/frontend/src/components/launches/providers/tiktok/tiktok.provider.tsx @@ -11,6 +11,8 @@ import { TikTokDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settin import { useSettings } from '@gitroom/frontend/components/launches/helpers/use.values'; import { Select } from '@gitroom/react/form/select'; import { useCustomProviderFunction } from '@gitroom/frontend/components/launches/helpers/use.custom.provider.function'; +import { Checkbox } from '@gitroom/react/form/checkbox'; +import clsx from 'clsx'; const privacyLevel = [ { @@ -103,13 +105,16 @@ const CheckTikTokValidity: FC<{ picture: string }> = (props) => { }; const TikTokSettings: FC<{ values?: any }> = (props) => { - const { register, control } = useSettings(); + const { watch, register, formState, control } = useSettings(); + const disclose = watch('disclose'); + const brand_organic_toggle = watch('brand_organic_toggle'); + const brand_content_toggle = watch('brand_content_toggle'); return (
- - +
+
Allow User To:
+
+ + + +
+
+
+ + {disclose && ( +
+
+ + + +
+
+ Your video will be labeled {'"'}Promotional Content{'"'}.
+ This cannot be changed once your video is posted. +
+
+ )} +
+ Turn on to disclose that this video promotes good or services in + exchange for something of value. You video could promote yourself, a + third party, or both. +
+
- - - - - +
+ +
+ You are promoting yourself or your own brand. +
+ This video will be classified as Brand Organic. +
+ +
+ You are promoting another brand or a third party. +
+ This video will be classified as Branded Content. +
+ {(brand_organic_toggle || brand_content_toggle) && ( +
+ By posting, you agree to TikTok{"'"}s{' '} + {[ + brand_organic_toggle || brand_content_toggle ? ( + + Music Usage Confirmation + + ) : undefined, + brand_content_toggle ? <> and : undefined, + brand_content_toggle ? ( + + Branded Content Policy + + ) : undefined, + ].filter((f) => f)} +
+ )} +
); }; diff --git a/libraries/nestjs-libraries/src/dtos/posts/providers-settings/tiktok.dto.ts b/libraries/nestjs-libraries/src/dtos/posts/providers-settings/tiktok.dto.ts index 6bca5fd8..28c49024 100644 --- a/libraries/nestjs-libraries/src/dtos/posts/providers-settings/tiktok.dto.ts +++ b/libraries/nestjs-libraries/src/dtos/posts/providers-settings/tiktok.dto.ts @@ -15,13 +15,13 @@ export class TikTokDto { | 'SELF_ONLY'; @IsBoolean() - disable_duet: boolean; + duet: boolean; @IsBoolean() - disable_stitch: boolean; + stitch: boolean; @IsBoolean() - disable_comment: boolean; + comment: boolean; @IsBoolean() brand_content_toggle: boolean; diff --git a/libraries/nestjs-libraries/src/integrations/social/tiktok.provider.ts b/libraries/nestjs-libraries/src/integrations/social/tiktok.provider.ts index c5e22d09..b7786fef 100644 --- a/libraries/nestjs-libraries/src/integrations/social/tiktok.provider.ts +++ b/libraries/nestjs-libraries/src/integrations/social/tiktok.provider.ts @@ -188,9 +188,9 @@ export class TiktokProvider extends SocialAbstract implements SocialProvider { post_info: { title: firstPost.message, privacy_level: firstPost.settings.privacy_level, - disable_duet: firstPost.settings.disable_duet, - disable_comment: firstPost.settings.disable_comment, - disable_stitch: firstPost.settings.disable_stitch, + disable_duet: !firstPost.settings.duet, + disable_comment: !firstPost.settings.comment, + disable_stitch: !firstPost.settings.stitch, brand_content_toggle: firstPost.settings.brand_content_toggle, brand_organic_toggle: firstPost.settings.brand_organic_toggle, }, diff --git a/libraries/react-shared-libraries/src/form/checkbox.tsx b/libraries/react-shared-libraries/src/form/checkbox.tsx index 8090d000..9e05de75 100644 --- a/libraries/react-shared-libraries/src/form/checkbox.tsx +++ b/libraries/react-shared-libraries/src/form/checkbox.tsx @@ -1,63 +1,50 @@ 'use client'; -import { FC, forwardRef, useCallback, useState } from 'react'; -import clsx from 'clsx'; -import Image from 'next/image'; -import { useFormContext, useWatch } from 'react-hook-form'; -export const Checkbox = forwardRef void; - variant?: 'default' | 'hollow'; -}>((props, ref: any) => { - const { checked, className, disableForm, variant } = props; +import { DetailedHTMLProps, FC, InputHTMLAttributes, useMemo } from 'react'; +import { clsx } from 'clsx'; +import { useFormContext } from 'react-hook-form'; +import interClass from '../helpers/inter.font'; +import { RegisterOptions } from 'react-hook-form/dist/types/validator'; + +export const Checkbox: FC< + DetailedHTMLProps< + InputHTMLAttributes, + HTMLInputElement + > & { + error?: any; + extraForm?: RegisterOptions; + disableForm?: boolean; + label: string; + name: string; + hideErrors?: boolean; + } +> = (props) => { + const { + label, + className, + hideErrors, + disableForm, + error, + extraForm, + name, + ...rest + } = props; const form = useFormContext(); - const register = disableForm ? {} : form.register(props.name!); - - const watch = disableForm ? undefined : useWatch({ - name: props.name!, - }); - - const [currentStatus, setCurrentStatus] = useState(watch || checked); - const changeStatus = useCallback(() => { - setCurrentStatus(!currentStatus); - props?.onChange?.({ target: { name: props.name!, value: !currentStatus } }); - if (!disableForm) { - // @ts-ignore - register?.onChange?.({ target: { name: props.name!, value: !currentStatus } }); - } - }, [currentStatus]); return ( -
- {currentStatus && ( -
- - - -
- )} +
+
); -}); +}; \ No newline at end of file