add devto, medium and hashnode

Author: nevo-david

apps/frontend/src/components/launches/polonto.tsx

@@ -44,7 +44,7 @@ const ActionControls = ({ store }: any) => {
       <Button
         loading={load}
         className="outline-none"
-        innerClassName="invert outline-none"
+        innerClassName="invert outline-none text-black"
         onClick={async () => {
           setLoad(true);
           const blob = await store.toBlob();
@@ -56,10 +56,10 @@ const ActionControls = ({ store }: any) => {
               body: formData,
             })
           ).json();
-          close.setMedia({
+          close.setMedia([{
             id: data.id,
             path: data.path,
-          });
+          }]);
           close.close();
         }}
       >
@@ -69,7 +69,7 @@ const ActionControls = ({ store }: any) => {
   );
 };
 const Polonto: FC<{
-  setMedia: (params: { id: string; path: string }) => void;
+  setMedia: (params: { id: string; path: string }[]) => void;
   type?: 'image' | 'video';
   closeModal: () => void;
   width?: number;

apps/frontend/src/components/media/media.component.tsx

@@ -127,7 +127,7 @@ export const Pagination: FC<{
 export const ShowMediaBoxModal: FC = () => {
   const [showModal, setShowModal] = useState(false);
   const [callBack, setCallBack] =
-    useState<(params: { id: string; path: string }) => void | undefined>();
+    useState<(params: { id: string; path: string }[]) => void | undefined>();
   const closeModal = useCallback(() => {
     setShowModal(false);
     setCallBack(undefined);
@@ -155,7 +155,7 @@ export const showMediaBox = (
 };
 const CHUNK_SIZE = 1024 * 1024;
 export const MediaBox: FC<{
-  setMedia: (params: { id: string; path: string }) => void;
+  setMedia: (params: { id: string; path: string }[]) => void;
   type?: 'image' | 'video';
   closeModal: () => void;
 }> = (props) => {
@@ -767,12 +767,12 @@ export const MediaComponent: FC<{
   const showDesignModal = useCallback(() => {
     setMediaModal(true);
   }, [modal]);
-  const changeMedia = useCallback((m: { path: string; id: string }) => {
-    setCurrentMedia(m);
+  const changeMedia = useCallback((m: { path: string; id: string }[]) => {
+    setCurrentMedia(m[0]);
     onChange({
       target: {
         name,
-        value: m,
+        value: m[0],
       },
     });
   }, []);
@@ -807,7 +807,7 @@ export const MediaComponent: FC<{
         <div className="my-[20px] cursor-pointer w-[200px] h-[200px] border-2 border-tableBorder">
           <img
             className="w-full h-full object-cover"
-            src={mediaDirectory.set(currentMedia.path)}
+            src={currentMedia.path}
             onClick={() => window.open(mediaDirectory.set(currentMedia.path))}
           />
         </div>

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

@@ -90,8 +90,8 @@ export default withProvider({
   postComment: PostComment.COMMENT,
   minimumCharacters: [],
   SettingsComponent: DevtoSettings,
-  CustomPreviewComponent: DevtoPreview,
+  CustomPreviewComponent: undefined, // DevtoPreview,
   dto: DevToSettingsDto,
   checkValidity: undefined,
-  maximumCharacters: undefined,
+  maximumCharacters: 100000,
 });

apps/frontend/src/components/new-launch/providers/devto/devto.tags.tsx

@@ -16,6 +16,7 @@ export const DevtoTags: FC<{
   }) => void;
 }> = (props) => {
   const { onChange, name, label } = props;
+  const form = useSettings();
   const customFunc = useCustomProviderFunction();
   const [tags, setTags] = useState<any[]>([]);
   const { getValues } = useSettings();
@@ -24,14 +25,9 @@ export const DevtoTags: FC<{
     (tagIndex: number) => {
       const modify = tagValue.filter((_, i) => i !== tagIndex);
       setTagValue(modify);
-      onChange({
-        target: {
-          value: modify,
-          name,
-        },
-      });
+      form.setValue(name, modify);
     },
-    [tagValue]
+    [tagValue, name, form]
   );
   const onAddition = useCallback(
     (newTag: any) => {
@@ -40,14 +36,9 @@ export const DevtoTags: FC<{
       }
       const modify = [...tagValue, newTag];
       setTagValue(modify);
-      onChange({
-        target: {
-          value: modify,
-          name,
-        },
-      });
+      form.setValue(name, modify);
     },
-    [tagValue]
+    [tagValue, name, form]
   );
   useEffect(() => {
     customFunc.get('tags').then((data) => setTags(data));

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

@@ -92,8 +92,8 @@ export default withProvider({
   postComment: PostComment.COMMENT,
   minimumCharacters: [],
   SettingsComponent: HashnodeSettings,
-  CustomPreviewComponent: HashnodePreview,
+  CustomPreviewComponent: undefined, // HashnodePreview,
   dto: HashnodeSettingsDto,
   checkValidity: undefined,
-  maximumCharacters: undefined,
+  maximumCharacters: 10000,
 });

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

@@ -67,11 +67,11 @@ const MediumSettings: FC = () => {
   );
 };
 export default withProvider({
-  postComment: PostComment.COMMENT,
+  postComment: PostComment.POST,
   minimumCharacters: [],
   SettingsComponent: MediumSettings,
-  CustomPreviewComponent: MediumPreview,
+  CustomPreviewComponent: undefined, //MediumPreview,
   dto: MediumSettingsDto,
   checkValidity: undefined,
-  maximumCharacters: undefined,
+  maximumCharacters: 100000,
 });

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

@@ -10,6 +10,9 @@ import { SlackDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-setting
 import { InstagramDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/instagram.dto';
 import { LinkedinDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/linkedin.dto';
 import { IsIn } from 'class-validator';
+import { MediumSettingsDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/medium.settings.dto';
+import { DevToSettingsDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/dev.to.settings.dto';
+import { HashnodeSettingsDto } from '@gitroom/nestjs-libraries/dtos/posts/providers-settings/hashnode.settings.dto';
 
 export type ProviderExtension<T extends string, M> = { __type: T } & M;
 export type AllProvidersSettings =
@@ -26,6 +29,9 @@ export type AllProvidersSettings =
   | ProviderExtension<'linkedin-page', LinkedinDto>
   | ProviderExtension<'instagram', InstagramDto>
   | ProviderExtension<'instagram-standalone', InstagramDto>
+  | ProviderExtension<'medium', MediumSettingsDto>
+  | ProviderExtension<'devto', DevToSettingsDto>
+  | ProviderExtension<'hashnode', HashnodeSettingsDto>
   | ProviderExtension<'facebook', None>
   | ProviderExtension<'threads', None>
   | ProviderExtension<'mastodon', None>
@@ -52,6 +58,9 @@ export const allProviders = (setEmpty?: any) => {
     { value: LinkedinDto, name: 'linkedin-page' },
     { value: InstagramDto, name: 'instagram' },
     { value: InstagramDto, name: 'instagram-standalone' },
+    { value: MediumSettingsDto, name: 'medium' },
+    { value: DevToSettingsDto, name: 'devto' },
+    { value: HashnodeSettingsDto, name: 'hashnode' },
     { value: setEmpty, name: 'facebook' },
     { value: setEmpty, name: 'threads' },
     { value: setEmpty, name: 'mastodon' },

libraries/nestjs-libraries/src/dtos/posts/providers-settings/dev.to.settings.dto.ts

@@ -41,6 +41,7 @@ export class DevToSettingsDto {
 
   @IsArray()
   @ArrayMaxSize(4)
-  @IsOptional()
+  @Type(() => DevToTagsSettingsDto)
+  @ValidateNested({ each: true })
   tags: DevToTagsSettingsDto[];
 }

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

@@ -53,5 +53,7 @@ export class HashnodeSettingsDto {
 
   @IsArray()
   @ArrayMinSize(1)
+  @Type(() => HashnodeTagsSettings)
+  @ValidateNested({ each: true })
   tags: HashnodeTagsSettings[];
 }