feat(ui): use ExternalLink for announcement component

Author: psychedelicious

invokeai/frontend/web/src/features/ui/components/CanvasV2Announcement.tsx

@@ -1,6 +1,5 @@
-import { Flex, Icon, ListItem, Text, UnorderedList } from '@invoke-ai/ui-library';
+import { ExternalLink, Flex, ListItem, UnorderedList } from '@invoke-ai/ui-library';
 import { useTranslation } from 'react-i18next';
-import { PiArrowSquareOutBold } from 'react-icons/pi';
 
 export const CanvasV2Announcement = () => {
   const { t } = useTranslation();
@@ -12,24 +11,24 @@ export const CanvasV2Announcement = () => {
         <ListItem>{t('whatsNew.canvasV2Announcement.fluxSupport')}</ListItem>
       </UnorderedList>
       <Flex flexDir="column" gap={1}>
-        <Flex gap={2}>
-          <Text as="a" target="_blank" href="https://github.com/invoke-ai/InvokeAI/releases" fontWeight="semibold">
-            {t('whatsNew.canvasV2Announcement.readReleaseNotes')}
-          </Text>
-          <Icon as={PiArrowSquareOutBold} />
-        </Flex>
-        <Flex gap={2}>
-          <Text as="a" target="_blank" href="https://www.youtube.com/@invokeai/videos" fontWeight="semibold">
-            {t('whatsNew.canvasV2Announcement.watchReleaseVideo')}
-          </Text>
-          <Icon as={PiArrowSquareOutBold} />
-        </Flex>
-        <Flex gap={2}>
-          <Text as="a" target="_blank" href="https://www.youtube.com/@invokeai/videos" fontWeight="semibold">
-            {t('whatsNew.canvasV2Announcement.watchUiUpdatesOverview')}
-          </Text>
-          <Icon as={PiArrowSquareOutBold} />
-        </Flex>
+        <ExternalLink
+          fontSize="sm"
+          fontWeight="semibold"
+          label={t('whatsNew.canvasV2Announcement.readReleaseNotes')}
+          href="https://github.com/invoke-ai/InvokeAI/releases"
+        />
+        <ExternalLink
+          fontSize="sm"
+          fontWeight="semibold"
+          label={t('whatsNew.canvasV2Announcement.watchReleaseVideo')}
+          href="https://www.youtube.com/@invokeai/videos"
+        />
+        <ExternalLink
+          fontSize="sm"
+          fontWeight="semibold"
+          label={t('whatsNew.canvasV2Announcement.watchUiUpdatesOverview')}
+          href="https://www.youtube.com/@invokeai/videos"
+        />
       </Flex>
     </Flex>
   );