Fix some issues with message spacing (#10553)

src/components/dms/MessageItem.tsx

@@ -438,6 +438,7 @@ let MessageItem = ({
                   isFromSelf={isFromSelf}
                   squaredBottomCorner={squaredBottomCorner || hasEmbedAndText}
                   squaredTopCorner={squaredTopCorner}
+                  isFirstInCluster={isFirstInCluster}
                 />
               )}
               {rt.text.length > 0 && (
@@ -452,9 +453,10 @@ let MessageItem = ({
                           a.py_sm,
                           a.px_md,
                           {
-                            marginTop: isFirstInCluster
-                              ? 0
-                              : CLUSTERED_MESSAGE_GAP,
+                            marginTop:
+                              hasEmbedAndText || !isFirstInCluster
+                                ? CLUSTERED_MESSAGE_GAP
+                                : 0,
                             backgroundColor: isFromSelf
                               ? isPending
                                 ? pendingColor

src/components/dms/MessageItemEmbed.tsx

@@ -15,11 +15,13 @@ let MessageItemEmbed = ({
   isFromSelf,
   squaredTopCorner,
   squaredBottomCorner,
+  isFirstInCluster,
 }: {
   embed: $Typed<AppBskyEmbedRecord.View>
   isFromSelf: boolean
   squaredTopCorner: boolean
   squaredBottomCorner: boolean
+  isFirstInCluster: boolean
 }): React.ReactNode => {
   const t = useTheme()
   const screen = useWindowDimensions()
@@ -34,15 +36,14 @@ let MessageItemEmbed = ({
             width: Math.min(screen.width, 600) / 1.4,
           }),
           web({
-            width: '100%',
             minWidth: 280,
             maxWidth: 360,
           }),
           {
-            marginTop: CLUSTERED_MESSAGE_GAP,
+            marginTop: isFirstInCluster ? 0 : CLUSTERED_MESSAGE_GAP,
           },
         ]}>
-        <View style={{marginTop: -8}}>
+        <View>
           <Embed
             embed={embed}
             allowNestedQuotes