feat: faster remove of socials from scheduling

Author: nevo-david

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

@@ -1,12 +1,20 @@
 'use client';
 
-import { FC, RefObject, useEffect, useRef, useState } from 'react';
-import { useLaunchStore } from '@gitroom/frontend/components/new-launch/store';
+import { FC, RefObject, useCallback, useEffect, useRef, useState } from 'react';
+import {
+  SelectedIntegrations,
+  useLaunchStore,
+} from '@gitroom/frontend/components/new-launch/store';
 import clsx from 'clsx';
 import Image from 'next/image';
 import { useShallow } from 'zustand/react/shallow';
 import { GlobalIcon } from '@gitroom/frontend/components/ui/icons';
 import { useT } from '@gitroom/react/translation/get.transation.service.client';
+import { Integrations } from '@gitroom/frontend/components/launches/calendar.context';
+import {
+  useDecisionModal,
+  useModals,
+} from '@gitroom/frontend/components/layout/new-modal';
 
 export function useHasScroll(ref: RefObject<HTMLElement>): boolean {
   const [hasHorizontalScroll, setHasHorizontalScroll] = useState(false);
@@ -43,20 +51,47 @@ export function useHasScroll(ref: RefObject<HTMLElement>): boolean {
 }
 
 export const SelectCurrent: FC = () => {
-  const { selectedIntegrations, current, setCurrent, locked, setHide } =
-    useLaunchStore(
-      useShallow((state) => ({
-        selectedIntegrations: state.selectedIntegrations,
-        current: state.current,
-        setCurrent: state.setCurrent,
-        locked: state.locked,
-        setHide: state.setHide,
-      }))
-    );
+  const modals = useDecisionModal();
+  const {
+    selectedIntegrations,
+    current,
+    setCurrent,
+    locked,
+    setHide,
+    addOrRemoveSelectedIntegration,
+  } = useLaunchStore(
+    useShallow((state) => ({
+      selectedIntegrations: state.selectedIntegrations,
+      addOrRemoveSelectedIntegration: state.addOrRemoveSelectedIntegration,
+      current: state.current,
+      setCurrent: state.setCurrent,
+      locked: state.locked,
+      setHide: state.setHide,
+    }))
+  );
 
   const contentRef = useRef<HTMLDivElement>(null);
   const hasScroll = useHasScroll(contentRef);
 
+  const removeSocial = useCallback(
+    (sIntegration: Integrations) => async (e: any) => {
+      e.stopPropagation();
+      e.preventDefault();
+      const open = await modals.open({
+        title: 'Remove Social Account',
+        description:
+          'Are you sure you want to remove this social from scheduling?',
+      });
+
+      if (!open) {
+        return;
+      }
+
+      addOrRemoveSelectedIntegration(sIntegration, {});
+    },
+    []
+  );
+
   return (
     <>
       <div className="select-none left-0 absolute w-full z-[100] px-[20px]">
@@ -97,6 +132,12 @@ export const SelectCurrent: FC = () => {
                   : 'border-transparent'
               )}
             >
+              <div
+                onClick={removeSocial(integration)}
+                className="absolute justify-center items-center flex w-[8px] h-[8px] -top-[1px] -start-[3px] bg-red-500 rounded-full text-white text-[8px]"
+              >
+                X
+              </div>
               <IsGlobal id={integration.id} />
               <div
                 {...{

libraries/nestjs-libraries/src/integrations/social/tiktok.provider.ts

@@ -312,7 +312,6 @@ export class TiktokProvider extends SocialAbstract implements SocialProvider {
       })
     ).json();
 
-    console.log(this.scopes, scope);
     this.checkScopes(this.scopes, scope);
 
     const {