From 5fd8043c991f45bf560b7098213e0be11c24f2b7 Mon Sep 17 00:00:00 2001
From: Dimitri POSTOLOV <en3m@ya.ru>
Date: Fri, 14 Jun 2024 09:21:13 +0200
Subject: [PATCH] remove more unused v2 components, fix `href="emailto:` with
 `href="mailto:` (#4972)

---
 packages/web/app/src/components/error.tsx     |  4 +-
 .../web/app/src/components/ui/query-error.tsx |  2 +-
 .../app/src/components/v2/project-types.tsx   | 67 -------------------
 .../src/components/v2/shine-background.tsx    | 13 ----
 .../web/app/src/components/v2/skeleton.tsx    | 34 ----------
 .../organization-subscription-manage.tsx      |  2 +-
 6 files changed, 4 insertions(+), 118 deletions(-)
 delete mode 100644 packages/web/app/src/components/v2/project-types.tsx
 delete mode 100644 packages/web/app/src/components/v2/shine-background.tsx
 delete mode 100644 packages/web/app/src/components/v2/skeleton.tsx

diff --git a/packages/web/app/src/components/error.tsx b/packages/web/app/src/components/error.tsx
index b41e8f27b..ebc5cd051 100644
--- a/packages/web/app/src/components/error.tsx
+++ b/packages/web/app/src/components/error.tsx
@@ -14,7 +14,7 @@ export function ErrorComponent(props: { error: any }) {
     void flush(2000);
   }, []);
 
-  const isLoggedIn = (session.loading === false && session?.doesSessionExist === true) || false;
+  const isLoggedIn = !session.loading && session.doesSessionExist;
 
   return (
     <div className="flex size-full items-center justify-center">
@@ -41,7 +41,7 @@ export function ErrorComponent(props: { error: any }) {
               <p>
                 If you wish to track it later or share more details with us,{' '}
                 <Button variant="link" className="h-auto p-0 text-orange-500" asChild>
-                  <a href="emailto:support@graphql-hive.com">you can use the support</a>
+                  <a href="mailto:support@graphql-hive.com">you can use the support</a>
                 </Button>
                 .
               </p>
diff --git a/packages/web/app/src/components/ui/query-error.tsx b/packages/web/app/src/components/ui/query-error.tsx
index f371f6b2b..b193ffa61 100644
--- a/packages/web/app/src/components/ui/query-error.tsx
+++ b/packages/web/app/src/components/ui/query-error.tsx
@@ -61,7 +61,7 @@ export function QueryError({
                     </Button>
                   ) : (
                     <Button variant="link" className="h-auto p-0 text-orange-500" asChild>
-                      <a href="emailto:support@graphql-hive.com">you can use the support</a>
+                      <a href="mailto:support@graphql-hive.com">you can use the support</a>
                     </Button>
                   )}
                   .
diff --git a/packages/web/app/src/components/v2/project-types.tsx b/packages/web/app/src/components/v2/project-types.tsx
deleted file mode 100644
index 7d0bcf831..000000000
--- a/packages/web/app/src/components/v2/project-types.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import { ReactElement } from 'react';
-import clsx from 'clsx';
-import { Radio, RadioGroup } from '@/components/v2';
-import { ProjectType } from '@/gql/graphql';
-import { RadioGroupProps } from '@radix-ui/react-radio-group';
-import federation from '../../../public/images/figures/federation.svg';
-import single from '../../../public/images/figures/single.svg';
-import stitching from '../../../public/images/figures/stitching.svg';
-
-const PROJECTS: {
-  title: 'REGULAR' | 'DISTRIBUTED';
-  type: ProjectType;
-  image: string;
-  description: string;
-}[] = [
-  {
-    title: 'REGULAR',
-    type: ProjectType.Single,
-    image: single,
-    description: 'Single API approach',
-  },
-  {
-    title: 'DISTRIBUTED',
-    type: ProjectType.Federation,
-    image: federation,
-    description: 'Apollo Federation specification',
-  },
-  {
-    title: 'DISTRIBUTED',
-    type: ProjectType.Stitching,
-    image: stitching,
-    description: 'Built using Schema Stitching',
-  },
-];
-
-export const ProjectTypes = (
-  props: Omit<RadioGroupProps, 'children' | 'className'>,
-): ReactElement => {
-  return (
-    <RadioGroup {...props}>
-      {PROJECTS.map(({ type, image, title, description }) => {
-        const capitalizedType = type[0] + type.slice(1).toLowerCase();
-        return (
-          <Radio key={type} value={type} className="flex border-transparent bg-gray-800">
-            <img
-              src={image}
-              alt={`${capitalizedType} project illustration`}
-              className="drag-none rounded-sm bg-black"
-            />
-            <div className="grow p-2.5">
-              <h4
-                className={clsx(
-                  'text-xs font-medium',
-                  title === 'DISTRIBUTED' ? 'text-[#1cc8ee]' : 'text-orange-500',
-                )}
-              >
-                {title}
-              </h4>
-              <h2 className="font-bold leading-none">{capitalizedType}</h2>
-              <span className="self-end text-sm font-medium text-gray-500">{description}</span>
-            </div>
-          </Radio>
-        );
-      })}
-    </RadioGroup>
-  );
-};
diff --git a/packages/web/app/src/components/v2/shine-background.tsx b/packages/web/app/src/components/v2/shine-background.tsx
deleted file mode 100644
index 6cbe589f0..000000000
--- a/packages/web/app/src/components/v2/shine-background.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { ReactElement } from 'react';
-
-export const ShineBackground = (): ReactElement => {
-  return (
-    <div
-      className="absolute inset-0 z-[-1]"
-      style={{
-        background: `url(/images/bg-top-shine.png) no-repeat left top/468px 278px,
-                     url(/images/bg-bottom-shine.png) no-repeat right bottom/330px 399px`,
-      }}
-    />
-  );
-};
diff --git a/packages/web/app/src/components/v2/skeleton.tsx b/packages/web/app/src/components/v2/skeleton.tsx
deleted file mode 100644
index 6d293cbdc..000000000
--- a/packages/web/app/src/components/v2/skeleton.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import { CSSProperties, ReactElement } from 'react';
-import clsx from 'clsx';
-
-type Props = {
-  // children?: ReactNode;
-  className?: string;
-  visible: boolean;
-  circle?: boolean;
-  width?: CSSProperties['width'];
-};
-
-export const Skeleton = ({
-  className,
-  visible,
-  circle,
-  width,
-  ...props
-}: Props): ReactElement | null => {
-  if (!visible) {
-    return null;
-  }
-
-  return (
-    <div
-      className={clsx(
-        'animate-pulse bg-gray-900',
-        circle ? 'rounded-full' : 'rounded-md',
-        className,
-      )}
-      style={{ width }}
-      {...props}
-    />
-  );
-};
diff --git a/packages/web/app/src/pages/organization-subscription-manage.tsx b/packages/web/app/src/pages/organization-subscription-manage.tsx
index f233c27ef..8257fadb9 100644
--- a/packages/web/app/src/pages/organization-subscription-manage.tsx
+++ b/packages/web/app/src/pages/organization-subscription-manage.tsx
@@ -280,7 +280,7 @@ function Inner(props: {
     if (plan === 'ENTERPRISE') {
       return (
         <Button type="button" asChild className="mt-2">
-          <a href="emailto:contact@graphql-hive.com">Contact Us</a>
+          <a href="mailto:contact@graphql-hive.com">Contact Us</a>
         </Button>
       );
     }