Add gopher package and /bridge route

apps/hyperdrive-trading/README.md

@@ -48,6 +48,8 @@ cd apps/hyperdrive-trading
 
 ### Run locally
 
+First, copy the .env.sample to .env and you'll need to set the VITE_SEPOLIA_RPC_URL variable to an active rpc url.
+
 Serve with hot reload at <http://localhost:5173>.
 
 ```bash

apps/hyperdrive-trading/src/routeTree.gen.ts

@@ -11,6 +11,7 @@
 // Import Routes
 
 import { Route as rootRoute } from "./ui/routes/__root";
+import { Route as BridgeImport } from "./ui/routes/bridge";
 import { Route as IndexImport } from "./ui/routes/index";
 import { Route as MarketAddressImport } from "./ui/routes/market.$address";
 import { Route as MarketsImport } from "./ui/routes/markets";
@@ -28,6 +29,11 @@ const MarketsRoute = MarketsImport.update({
   getParentRoute: () => rootRoute,
 } as any);
 
+const BridgeRoute = BridgeImport.update({
+  path: "/bridge",
+  getParentRoute: () => rootRoute,
+} as any);
+
 const IndexRoute = IndexImport.update({
   path: "/",
   getParentRoute: () => rootRoute,
@@ -46,6 +52,10 @@ declare module "@tanstack/react-router" {
       preLoaderRoute: typeof IndexImport;
       parentRoute: typeof rootRoute;
     };
+    "/bridge": {
+      preLoaderRoute: typeof BridgeImport;
+      parentRoute: typeof rootRoute;
+    };
     "/markets": {
       preLoaderRoute: typeof MarketsImport;
       parentRoute: typeof rootRoute;
@@ -65,6 +75,7 @@ declare module "@tanstack/react-router" {
 
 export const routeTree = rootRoute.addChildren([
   IndexRoute,
+  BridgeRoute,
   MarketsRoute,
   VoidRoute,
   MarketAddressRoute,

apps/hyperdrive-trading/src/ui/app/Navbar/DevtoolsMenu.tsx

@@ -16,6 +16,9 @@ export function DevtoolsMenu(): ReactElement {
         {/* <FeatureFlagMenuItem flagName="name-here">
         Menu Item Name here
         </FeatureFlagMenuItem> */}
+        <FeatureFlagMenuItem flagName="bridge">
+          Bridge Assets
+        </FeatureFlagMenuItem>
         <MenuItem
           onClick={() => {
             throw new Error(
@@ -29,7 +32,7 @@ export function DevtoolsMenu(): ReactElement {
   );
 }
 
-function DevtoolsMenuItem({
+function FeatureFlagMenuItem({
   flagName,
   children,
 }: {

apps/hyperdrive-trading/src/ui/bridge/Bridge.tsx

@@ -0,0 +1,13 @@
+import { ReactElement } from "react";
+import { useAppConfig } from "src/ui/appconfig/useAppConfig";
+
+export function Bridge(): ReactElement {
+  const appConfig = useAppConfig();
+  return (
+    <div>
+      <h1>Bridge</h1>
+    </div>
+  );
+}
+
+export default Bridge;

apps/hyperdrive-trading/src/ui/bridge/routes.ts

@@ -0,0 +1 @@
+export const BRIDGE_ROUTE = "/bridge";

apps/hyperdrive-trading/src/ui/markets/YourBalanceWell/YourBalanceWell.tsx

@@ -5,13 +5,15 @@ import {
   findBaseToken,
   findYieldSourceToken,
 } from "@hyperdrive/appconfig";
+import { Link } from "@tanstack/react-router";
 import { ReactElement } from "react";
 import Skeleton from "react-loading-skeleton";
 import { cloudChain } from "src/chains/cloudChain";
 import { SupportedChainId } from "src/chains/supportedChains";
 import { ETH_MAGIC_NUMBER } from "src/token/ETH_MAGIC_NUMBER";
 import { useAppConfig } from "src/ui/appconfig/useAppConfig";
 import { Well } from "src/ui/base/components/Well/Well";
+import { useFeatureFlag } from "src/ui/base/featureFlags/featureFlags";
 import { formatBalance } from "src/ui/base/formatting/formatBalance";
 import { RevokeAllowanceModalButton } from "src/ui/token/RevokeAllowanceModalButton";
 import { useMintToken } from "src/ui/token/hooks/useMintToken";
@@ -62,6 +64,7 @@ function AvailableAsset({
   token: TokenConfig<any>;
 }) {
   const { address: account } = useAccount();
+  const { isFlagEnabled: isBridgeFlagEnabled } = useFeatureFlag("bridge");
   const isEth = token.address === ETH_MAGIC_NUMBER;
   const { balance: tokenBalance, status: tokenBalanceStatus } = useTokenBalance(
     {
@@ -157,6 +160,11 @@ function AvailableAsset({
                   token={token}
                   spender={spender}
                 />
+                {isBridgeFlagEnabled ? (
+                  <li>
+                    <Link to="/bridge">Bridge</Link>
+                  </li>
+                ) : undefined}
                 {isTestnetChain ? (
                   <li>
                     <button disabled={!mint} onClick={() => mint?.()}>

apps/hyperdrive-trading/src/ui/routes/bridge.tsx

@@ -0,0 +1,5 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { BRIDGE_ROUTE } from "src/ui/bridge/routes";
+export const Route = createFileRoute(BRIDGE_ROUTE)({
+  component: () => <div>hi</div>,
+});

packages/gopher/.eslintrc

@@ -0,0 +1,4 @@
+{
+  "root": true,
+  "extends": ["@hyperdrive/eslint-config"]
+}

packages/gopher/.gitignore

@@ -0,0 +1,2 @@
+dist
+node_modules

packages/gopher/.prettierignore

@@ -0,0 +1,2 @@
+node_modules
+dist

packages/gopher/.prettierrc.js

@@ -0,0 +1,19 @@
+// TODO: use this import when typescript-swagger-api has esm support:
+// https://github.com/acacode/swagger-typescript-api/pull/788
+
+// import { repoConfig } from "@hyperdrive/prettier-config";
+
+const repoConfig = {
+  tabWidth: 2,
+  useTabs: false,
+  trailingComma: "all",
+  singleQuote: false,
+  semi: true,
+  printWidth: 80,
+};
+
+/** @type {import("prettier").Config} */
+module.exports = {
+  ...repoConfig,
+  plugins: ["prettier-plugin-organize-imports"],
+};