chore: ghost button (#596)

schema.gql

@@ -52,6 +52,7 @@ type AmbossSubscription {
 
 type AmbossUser {
   backups: UserBackupInfo!
+  ghost: UserGhostInfo!
   subscription: AmbossSubscription!
 }
 
@@ -263,6 +264,10 @@ type ChannelsTimeHealth {
   score: Float
 }
 
+type ClaimGhostAddress {
+  username: String!
+}
+
 type ClosedChannel {
   capacity: Float!
   channel_age: Float
@@ -485,6 +490,7 @@ type Mutation {
   addPeer(isTemporary: Boolean, publicKey: String, socket: String, url: String): Boolean!
   bosRebalance(avoid: [String!], in_through: String, max_fee: Float, max_fee_rate: Float, max_rebalance: Float, node: String, out_inbound: Float, out_through: String, timeout_minutes: Float): BosRebalanceResult!
   claimBoltzTransaction(destination: String!, fee: Float!, preimage: String!, privateKey: String!, redeem: String!, transaction: String!): String!
+  claimGhostAddress(address: String): ClaimGhostAddress!
   closeChannel(forceClose: Boolean, id: String!, targetConfirmations: Float, tokensPerVByte: Float): OpenOrCloseChannel!
   createAddress(type: String! = "p2tr"): String!
   createBaseInvoice(amount: Float!): BaseInvoice!
@@ -843,6 +849,10 @@ type UserBackupInfo {
   total_size_saved: String!
 }
 
+type UserGhostInfo {
+  username: String
+}
+
 type Utxo {
   address: String!
   address_format: String!

src/client/pages/amboss/index.tsx

@@ -9,6 +9,7 @@ import { SectionTitle, Text } from '../../src/components/typography/Styled';
 import { Healthchecks } from '../../src/views/amboss/Healthchecks';
 import { Balances } from '../../src/views/amboss/Balances';
 import { Billboard } from '../../src/views/amboss/Billboard';
+import { Ghost } from '../../src/views/amboss/Ghost';
 
 const AmbossView = () => (
   <>
@@ -28,6 +29,7 @@ const AmbossView = () => (
 const Wrapped = () => (
   <GridWrapper>
     <AmbossView />
+    <Ghost />
     <Backups />
     <Healthchecks />
     <Balances />

src/client/src/components/link/Link.tsx

@@ -73,7 +73,7 @@ export const Link: React.FC<LinkProps> = ({
       <CorrectLink
         href={href}
         {...props}
-        {...(newTab && { target: '_blank', rel: 'noreferrer' })}
+        {...(newTab && { target: '_blank', rel: 'noreferrer noopener' })}
       >
         {children}
       </CorrectLink>

src/client/src/components/logo/GhostIcon.tsx

@@ -0,0 +1,21 @@
+import { forwardRef } from 'react';
+
+export const GhostLogo = forwardRef<any, any>(
+  ({ color = 'currentColor', size = 100, children, ...rest }, ref) => {
+    return (
+      <svg
+        ref={ref}
+        xmlns="http://www.w3.org/2000/svg"
+        width={size}
+        fill={color}
+        viewBox="0 0 100 100"
+        {...rest}
+      >
+        {children}
+        <path d="M50 1C22.9 1 1 22.9 1 50v36.8C1 93.5 6.5 99 13.2 99s12.3-5.5 12.3-12.3C25.5 93.5 31 99 37.7 99 44.5 99 50 93.5 50 86.8 50 93.5 55.5 99 62.3 99c6.8 0 12.3-5.5 12.3-12.3C74.5 93.5 80 99 86.8 99 93.5 99 99 93.5 99 86.8V50C99 22.9 77.1 1 50 1z" />
+      </svg>
+    );
+  }
+);
+
+GhostLogo.displayName = 'GhostLogo';

src/client/src/graphql/mutations/claimGhostAddress.ts

@@ -0,0 +1,9 @@
+import { gql } from '@apollo/client';
+
+export const CLAIM_GHOST_ADDRESS = gql`
+  mutation ClaimGhostAddress($address: String) {
+    claimGhostAddress(address: $address) {
+      username
+    }
+  }
+`;

src/client/src/graphql/queries/getAmbossUser.ts

@@ -15,6 +15,9 @@ export const GET_AMBOSS_USER = gql`
         available_size
         remaining_size
       }
+      ghost {
+        username
+      }
     }
   }
 `;

src/client/src/graphql/types.ts

@@ -83,6 +83,7 @@ export type AmbossSubscription = {
 export type AmbossUser = {
   __typename?: 'AmbossUser';
   backups: UserBackupInfo;
+  ghost: UserGhostInfo;
   subscription: AmbossSubscription;
 };
 
@@ -321,6 +322,11 @@ export type ChannelsTimeHealth = {
   score?: Maybe<Scalars['Float']['output']>;
 };
 
+export type ClaimGhostAddress = {
+  __typename?: 'ClaimGhostAddress';
+  username: Scalars['String']['output'];
+};
+
 export type ClosedChannel = {
   __typename?: 'ClosedChannel';
   capacity: Scalars['Float']['output'];
@@ -565,6 +571,7 @@ export type Mutation = {
   addPeer: Scalars['Boolean']['output'];
   bosRebalance: BosRebalanceResult;
   claimBoltzTransaction: Scalars['String']['output'];
+  claimGhostAddress: ClaimGhostAddress;
   closeChannel: OpenOrCloseChannel;
   createAddress: Scalars['String']['output'];
   createBaseInvoice: BaseInvoice;
@@ -627,6 +634,10 @@ export type MutationClaimBoltzTransactionArgs = {
   transaction: Scalars['String']['input'];
 };
 
+export type MutationClaimGhostAddressArgs = {
+  address?: InputMaybe<Scalars['String']['input']>;
+};
+
 export type MutationCloseChannelArgs = {
   forceClose?: InputMaybe<Scalars['Boolean']['input']>;
   id: Scalars['String']['input'];
@@ -1199,6 +1210,11 @@ export type UserBackupInfo = {
   total_size_saved: Scalars['String']['output'];
 };
 
+export type UserGhostInfo = {
+  __typename?: 'UserGhostInfo';
+  username?: Maybe<Scalars['String']['output']>;
+};
+
 export type Utxo = {
   __typename?: 'Utxo';
   address: Scalars['String']['output'];

src/client/src/styles/GlobalStyle.ts

@@ -1,8 +1,11 @@
 import { createGlobalStyle } from 'styled-components';
 import { backgroundColor, textColor } from './Themes';
-import { Inter } from 'next/font/google';
+import { Noto_Sans } from 'next/font/google';
 
-const inter = Inter({ subsets: ['latin'] });
+const notoSans = Noto_Sans({
+  weight: ['100', '200', '300', '400', '500', '600', '700', '800', '900'],
+  subsets: ['latin'],
+});
 
 export const GlobalStyles = createGlobalStyle`
     html, body {
@@ -11,7 +14,7 @@ export const GlobalStyles = createGlobalStyle`
     }
     * {
         font-variant-numeric: tabular-nums;
-        font-family: ${inter.style.fontFamily}, sans-serif;
+        font-family: ${notoSans.style.fontFamily}, sans-serif;
     }
     *, *::after, *::before {
         box-sizing: border-box;
@@ -20,7 +23,7 @@ export const GlobalStyles = createGlobalStyle`
         background: ${backgroundColor};
         color: ${textColor};
         font-variant-numeric: tabular-nums;
-        font-family: ${inter.style.fontFamily}, sans-serif;
+        font-family: ${notoSans.style.fontFamily}, sans-serif;
         text-rendering: optimizeLegibility;
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;