feat: NFT.storage changes (#2560)

Make all (most?) of the requested changes from
https://github.com/orgs/w3s-project/projects/1/views/1?pane=issue&itemId=57594940

Note that once this PR is deployed, new user signups will be disabled -
I did not put these behind a feature flag as there doesn't seem to be a
strong need for one.

A few caveats:

1) I put the same banner at the top of every page - since the menu is in
the global layout it's tricky to get different banners displaying on
different pages. This means that the requests to have different pages
link to different URLs are challenging to accommodate, so I've gone down
the easy path.
2) The error message for new users is a little janky - I followed the
letter of the request but it's not terribly pretty:

<img width="1254" alt="Screenshot 2024-04-04 at 12 28 33 PM"
src="https://github.com/nftstorage/nft.storage/assets/1113/db13e99e-49f4-4453-bb90-e7c1d95afb62">

We could make this prettier but it's nontrivial work, so I'm proposing
we ship with this and iterate but would be open to iterating before we
ship.

packages/api/src/errors.js

@@ -284,3 +284,27 @@ export class ErrorAgentDIDRequired extends HTTPError {
   }
 }
 ErrorAgentDIDRequired.CODE = 'ERROR_AGENT_DID_REQUIRED'
+
+/**
+ * Error indicating a new user signup was denied and probably will be indefinitely,
+ * and the user should try a new product instead.
+ */
+export class NewUserDeniedTryOtherProductError extends HTTPError {
+  /**
+   * @param {string} message
+   * @param {URL} otherProduct
+   */
+  constructor(message, otherProduct) {
+    super(message, 403)
+    this.code = 'NEW_USER_DENIED_TRY_OTHER_PRODUCT'
+    this.otherProduct = otherProduct
+  }
+
+  toJSON() {
+    return {
+      message: this.message,
+      code: this.code,
+      otherProduct: this.otherProduct.toString(),
+    }
+  }
+}

packages/api/src/utils/auth.js

@@ -7,6 +7,7 @@ import {
   ErrorUnauthenticated,
   ErrorTokenBlocked,
   ErrorAgentDIDRequired,
+  NewUserDeniedTryOtherProductError,
 } from '../errors.js'
 import { parseJWT, verifyJWT } from './jwt.js'
 import * as Ucan from 'ucan-storage/ucan-storage'
@@ -137,6 +138,18 @@ export async function loginOrRegister(event, data, { db }) {
         ? await parseGithub(data.data, metadata)
         : parseMagic(metadata)
 
+    const dbUser =
+      data.type === 'github'
+        ? await db.getUser(parsed.sub)
+        : await db.getUser(parsed.issuer)
+    if (!dbUser) {
+      const otherProduct = new URL('https://nft.storage/')
+      throw new NewUserDeniedTryOtherProductError(
+        `We're no longer accepting new accounts for NFT.Storage Classic. Learn more about our new experience>> ${otherProduct.toString()}`,
+        otherProduct
+      )
+    }
+
     const upsert = await db.upsertUser({
       email: parsed.email,
       github_id: parsed.sub,

packages/website/components/deprecationBanner.js

@@ -0,0 +1,10 @@
+export function DeprecationBanner() {
+  return (
+    <div className="w-full text-center p-3 bg-black text-white text-sm">
+      We&apos;re evolving our platform for you. Learn more &gt;&gt;&nbsp;
+      <a href="https://nft.storage/blog/the-next-chapter-of-nftstorage">
+        https://nft.storage/blog/the-next-chapter-of-nftstorage
+      </a>
+    </div>
+  )
+}

packages/website/components/footer.js

@@ -105,6 +105,16 @@ export default function Footer() {
           </Link>
         </span>
         <Dot />
+        <span className="block lg:inline-block my-4">
+          <Link
+            href="/privacy"
+            className="nspink no-underline underline-hover align-middle"
+            onClick={onLinkClick}
+          >
+            Privacy
+          </Link>
+        </span>
+        <Dot />
         <span className="block lg:inline-block my-4">
           <span className="align-middle">Need Help? </span>
           <a

packages/website/components/layout.js

@@ -6,6 +6,7 @@ import { getStatusPageSummary } from '../lib/statuspage-api'
 import { getVersion } from '../lib/api'
 import { useQuery } from 'react-query'
 import { useUser } from '../lib/user'
+import { DeprecationBanner } from './deprecationBanner.js'
 
 const MaintenanceBanner = () => {
   let bannerMessage = ''
@@ -133,6 +134,7 @@ export default function Layout({
       ) : (
         <>
           <MaintenanceBanner />
+          <DeprecationBanner />
           <Navbar bgColor={navBgColor} logo={logo} user={user} />
           <div className="flex flex-col flex-auto">{children({ user })}</div>
           <Footer />

packages/website/pages/files.js

@@ -554,15 +554,7 @@ export default function Files({ user }) {
               'flex justify-center pt-4',
               status === 'loading' && 'hidden'
             )}
-          >
-            <Button
-              data-tf-popup="OTxv3w2O"
-              className="mx-4 mb-4"
-              variant="dark"
-            >
-              {'Tell us how we are doing'}
-            </Button>
-          </div>
+          ></div>
         </div>
       </main>
     </>