diff --git a/apps/frontend/src/components/launches/general.preview.component.tsx b/apps/frontend/src/components/launches/general.preview.component.tsx
new file mode 100644
index 00000000..a6d98d55
--- /dev/null
+++ b/apps/frontend/src/components/launches/general.preview.component.tsx
@@ -0,0 +1,90 @@
+import { useIntegration } from '@gitroom/frontend/components/launches/helpers/use.integration';
+import { useMediaDirectory } from '@gitroom/react/helpers/use.media.directory';
+import { useFormatting } from '@gitroom/frontend/components/launches/helpers/use.formatting';
+import clsx from 'clsx';
+import { VideoOrImage } from '@gitroom/react/helpers/video.or.image';
+import { Chakra_Petch } from 'next/font/google';
+const chakra = Chakra_Petch({ weight: '400', subsets: ['latin'] });
+
+export const GeneralPreviewComponent = () => {
+  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]')}>
+      <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-[#2E3336] 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-[#1D9BF0] 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-[#71767b] ml-[4px]">
+                  @username
+                </div>
+              </div>
+              <pre className={clsx('text-wrap', chakra.className)}>
+                {value.text}
+              </pre>
+              {!!value?.images?.length && (
+                <div className={clsx("w-full rounded-[16px] overflow-hidden mt-[12px]", value?.images?.length > 3 ? 'grid grid-cols-2 gap-[4px]' : 'flex gap-[4px]')}>
+                  {value.images.map((image, index) => (
+                    <a
+                      key={`image_${index}`}
+                      className="flex-1 h-[270px]"
+                      href={mediaDir.set(image.path)}
+                      target="_blank"
+                    >
+                      <VideoOrImage
+                        autoplay={true}
+                        src={mediaDir.set(image.path)}
+                      />
+                    </a>
+                  ))}
+                </div>
+              )}
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
diff --git a/apps/frontend/src/components/launches/providers/high.order.provider.tsx b/apps/frontend/src/components/launches/providers/high.order.provider.tsx
index 5da567ab..4971260a 100644
--- a/apps/frontend/src/components/launches/providers/high.order.provider.tsx
+++ b/apps/frontend/src/components/launches/providers/high.order.provider.tsx
@@ -32,6 +32,8 @@ import { linkedinCompany } from '@gitroom/frontend/components/launches/helpers/l
 import { Editor } from '@gitroom/frontend/components/launches/editor';
 import { useCopilotAction, useCopilotReadable } from '@copilotkit/react-core';
 import { AddPostButton } from '@gitroom/frontend/components/launches/add.post.button';
+import { GeneralPreviewComponent } from '@gitroom/frontend/components/launches/general.preview.component';
+import { capitalize } from 'lodash';
 
 // Simple component to change back to settings on after changing tab
 export const SetTab: FC<{ changeTab: () => void }> = (props) => {
@@ -277,7 +279,7 @@ export const withProvider = (
                   secondary={showTab !== 1}
                   onClick={changeToEditor}
                 >
-                  {editInPlace ? 'Edit globally' : 'Edit only this'}
+                  {editInPlace ? 'Edit globally' : `Edit only ${integration?.name} (${capitalize(integration?.identifier.replace('-', ' '))})`}
                 </Button>
               </div>
             </div>
@@ -288,7 +290,7 @@ export const withProvider = (
                 <div className="flex flex-col gap-[20px]">
                   {!existingData?.integration && (
                     <div className="bg-red-800">
-                      This will edit only this provider
+                      You are now editing only {integration?.name} ({capitalize(integration?.identifier.replace('-', ' '))})
                     </div>
                   )}
                   {InPlaceValue.map((val, index) => (
@@ -304,7 +306,7 @@ export const withProvider = (
                                 // ...commands
                                 //   .getCommands()
                                 //   .filter((f) => f.name !== 'image'),
-                                newImage,
+                                // newImage,
                                 postSelector(date),
                                 ...linkedinCompany(
                                   integration?.identifier!,
@@ -396,7 +398,7 @@ export const withProvider = (
                 {(editInPlace ? InPlaceValue : props.value)
                   .map((p) => p.content)
                   .join('').length ? (
-                  <PreviewComponent />
+                  <GeneralPreviewComponent />
                 ) : (
                   <>No Content Yet</>
                 )}