feat: added error/loading states for viewing a snippet

Author: dastrong-codiga

src/renderer/components/ViewSnippet/ViewSnippetError.tsx

@@ -0,0 +1,29 @@
+import { Flex, Link } from '@chakra-ui/react';
+import { EmptyState } from '@codiga/components';
+import { Link as RouterLink } from 'react-router-dom';
+import { APP_URL } from 'renderer/lib/config';
+
+export default function ViewSnippetError() {
+  return (
+    <EmptyState
+      title="Oops! An error occurred."
+      description="We couldn't find that snippet."
+      illustration="empty"
+      py="space_64"
+    >
+      <Flex gridGap="space_16">
+        <Link as={RouterLink} to="/" variant="secondary" size="sm">
+          Go Home
+        </Link>
+        <Link
+          isExternal
+          href={`${APP_URL}/support`}
+          variant="primary"
+          size="sm"
+        >
+          Contact Support
+        </Link>
+      </Flex>
+    </EmptyState>
+  );
+}

src/renderer/components/ViewSnippet/ViewSnippetLoading.tsx

@@ -0,0 +1,21 @@
+import { HStack, Skeleton } from '@chakra-ui/react';
+
+export default function ViewSnippetLoading() {
+  return (
+    <HStack
+      alignItems="center"
+      bg="neutral.25"
+      _dark={{ bg: 'base.dark' }}
+      h="74px"
+      w="full"
+      spacing="space_16"
+    >
+      <Skeleton h="28px" w="28px" />
+      <Skeleton h="26px" w="26px" />
+      <Skeleton h="26px" w="200px" />
+      <Skeleton h="28px" w="100px" />
+      <Skeleton h="28px" w="100px" />
+      <Skeleton h="28px" w="100px" />
+    </HStack>
+  );
+}