From eccc67b300dcfd9e5e6d3181637c4a1bbd149f72 Mon Sep 17 00:00:00 2001
From: Patrick O'Sullivan <patrick@osullivan.io>
Date: Mon, 9 Dec 2024 08:46:07 -0600
Subject: [PATCH] desktop: fix welcome sheet image, remove duplicate web
 component for welcome sheet

---
 packages/ui/src/components/WelcomeSheet.tsx   |   8 +-
 .../ui/src/components/WelcomeSheet.web.tsx    | 111 ------------------
 2 files changed, 6 insertions(+), 113 deletions(-)
 delete mode 100644 packages/ui/src/components/WelcomeSheet.web.tsx

diff --git a/packages/ui/src/components/WelcomeSheet.tsx b/packages/ui/src/components/WelcomeSheet.tsx
index 29abd49c73..08bc67c7e3 100644
--- a/packages/ui/src/components/WelcomeSheet.tsx
+++ b/packages/ui/src/components/WelcomeSheet.tsx
@@ -1,7 +1,7 @@
 import React, { useCallback } from 'react';
 import { Image } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { Text, View, XStack, YStack } from 'tamagui';
+import { Text, View, XStack, YStack, isWeb } from 'tamagui';
 
 import { Icon } from './Icon';
 import { Sheet } from './Sheet';
@@ -41,7 +41,11 @@ function WelcomeSheetComponent({
               <Image
                 style={{ width: '100%', height: 188 }}
                 resizeMode={'cover'}
-                source={require('../assets/raster/welcome_flowers.jpg')}
+                source={
+                  isWeb
+                    ? './welcome_flowers.jpg'
+                    : require('../assets/raster/welcome_flowers.jpg')
+                }
               />
             </View>
             <YStack gap="$xs">
diff --git a/packages/ui/src/components/WelcomeSheet.web.tsx b/packages/ui/src/components/WelcomeSheet.web.tsx
deleted file mode 100644
index 302751b0c6..0000000000
--- a/packages/ui/src/components/WelcomeSheet.web.tsx
+++ /dev/null
@@ -1,111 +0,0 @@
-import React, { useCallback } from 'react';
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { Text, View, XStack, YStack } from 'tamagui';
-
-import { Icon } from './Icon';
-import { Sheet } from './Sheet';
-
-function WelcomeSheetComponent({
-  open,
-  onOpenChange,
-}: {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-}) {
-  const handleDismiss = useCallback(() => {
-    onOpenChange(false);
-  }, [onOpenChange]);
-
-  const inset = useSafeAreaInsets();
-
-  return (
-    <Sheet
-      open={open}
-      onOpenChange={handleDismiss}
-      snapPointsMode="fit"
-      modal
-      dismissOnSnapToBottom
-      animation="quick"
-    >
-      <Sheet.Overlay />
-      <Sheet.LazyFrame
-        paddingTop="$s"
-        paddingBottom={inset.bottom}
-        paddingHorizontal="$2xl"
-      >
-        <Sheet.Handle marginBottom="$l" />
-        <View paddingHorizontal="$2xl" paddingBottom="$2xl">
-          <YStack gap="$2xl">
-            <View borderRadius="$xl" overflow="hidden">
-              <img
-                style={{ width: '100%', height: 188, objectFit: 'cover' }}
-                src="./groups/welcome_flowers.jpg"
-              />
-            </View>
-            <YStack gap="$xs">
-              <Text fontSize="$l2">Welcome to TM</Text>
-              <Text fontSize="$l" color="$tertiaryText">
-                A messenger you can finally trust.
-              </Text>
-            </YStack>
-            <XStack gap="$l">
-              <View>
-                <View
-                  backgroundColor={'$secondaryBackground'}
-                  borderRadius={'$3xl'}
-                  padding="$m"
-                >
-                  <Icon type="ChannelTalk" />
-                </View>
-              </View>
-              <YStack gap="$xs" flex={1}>
-                <Text fontWeight="$xl">Control every bit</Text>
-                <Text color="$tertiaryText" fontSize={'$xs'} lineHeight={'$xs'}>
-                  Whatever you do, say, and make on Tlon is yours to keep
-                </Text>
-              </YStack>
-            </XStack>
-            <XStack gap="$l">
-              <View>
-                <View
-                  backgroundColor={'$secondaryBackground'}
-                  borderRadius={'$3xl'}
-                  padding="$m"
-                >
-                  <Icon type="Clock" />
-                </View>
-              </View>
-              <YStack gap="$xs" flex={1}>
-                <Text fontWeight="$xl">From now until forever</Text>
-                <Text color="$tertiaryText" fontSize={'$xs'} lineHeight={'$xs'}>
-                  With Tlon you can always take your data with you and continue
-                  using it elsewhere
-                </Text>
-              </YStack>
-            </XStack>
-            <XStack gap="$l">
-              <View>
-                <View
-                  backgroundColor={'$secondaryBackground'}
-                  borderRadius={'$3xl'}
-                  padding="$m"
-                >
-                  <Icon type="Notifications" />
-                </View>
-              </View>
-              <YStack gap="$xs" flex={1}>
-                <Text fontWeight="$xl">Connect with calm</Text>
-                <Text color="$tertiaryText" fontSize={'$xs'} lineHeight={'$xs'}>
-                  Tlon is designed to maximize genuine connection, not addictive
-                  engagement
-                </Text>
-              </YStack>
-            </XStack>
-          </YStack>
-        </View>
-      </Sheet.LazyFrame>
-    </Sheet>
-  );
-}
-
-export const WelcomeSheet = React.memo(WelcomeSheetComponent);