feat: migrate lib to packages

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,9 +1,9 @@
 ---
 name: Bug report
 about: Create a report to help us improve
-title: ''
-labels: ''
-assignees: ''
+title: ""
+labels: ""
+assignees: ""
 ---
 
 **Describe the bug** A clear and concise description of what the bug is.

.github/ISSUE_TEMPLATE/custom.md

@@ -1,7 +1,7 @@
 ---
 name: Custom issue template
 about: Describe this issue template's purpose here.
-title: ''
-labels: ''
-assignees: ''
+title: ""
+labels: ""
+assignees: ""
 ---

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,9 +1,9 @@
 ---
 name: Feature request
 about: Suggest an idea for this project
-title: ''
-labels: ''
-assignees: ''
+title: ""
+labels: ""
+assignees: ""
 ---
 
 **Is your feature request related to a problem? Please describe.** A clear and concise description

.github/actions/setup/action.yml

@@ -21,4 +21,4 @@ runs:
 
     - name: Generate api typings
       shell: bash
-      run: pnpm graphql:gen
+      run: pnpm --filter lib graphql:gen

README.md

@@ -3,43 +3,49 @@
 _This project uses `pnpm`, if you haven't already installed it you can find the documentation here:
 https://pnpm.io/installation_
 
-_The monorepo uses [pnpm workspaces](https://pnpm.io/workspaces) along with Turborepo to manage build orchestration,
-to learn more about Turborepo please see the
+_The monorepo uses [pnpm workspaces](https://pnpm.io/workspaces) along with Turborepo to manage
+build orchestration, to learn more about Turborepo please see the
 [docs](https://turbo.build/repo/docs)._
 
 ## What's inside?
 
 This monorepo includes the following apps & packages:
 
 ### Apps
-- [apps/frontend-v3](https://github.com/balancer/frontend-monorepo/tree/main/apps/frontend-v3): The official web app for the Balancer protocol, hosted at [https://balancer.fi](https://balancer.fi).
 
+- [apps/frontend-v3](https://github.com/balancer/frontend-monorepo/tree/main/apps/frontend-v3): The
+  official web app for the Balancer protocol, hosted at [https://balancer.fi](https://balancer.fi).
 
 ### Packages
-- [packages/eslint-config](https://github.com/balancer/frontend-monorepo/tree/main/packages/eslint-config): eslint configurations.
-- [packages/typescript-config](https://github.com/balancer/frontend-monorepo/tree/main/packages/typescript-config): Typescript config's used throughout the monorepo.
 
+- [packages/eslint-config](https://github.com/balancer/frontend-monorepo/tree/main/packages/eslint-config):
+  eslint configurations.
+- [packages/typescript-config](https://github.com/balancer/frontend-monorepo/tree/main/packages/typescript-config):
+  Typescript config's used throughout the monorepo.
 
 ## Getting started
 
-To set up a local environment for development, first clone the repo and navigate
-to it in your console:
+To set up a local environment for development, first clone the repo and navigate to it in your
+console:
 
 ```
 git clone https://github.com/balancer/frontend-monorepo.git && cd frontend-monorepo
 ```
 
 Then create a local environment variable file for the `frontend-v3` app.
+
 ```
 cp apps/frontend-v3/.env.template apps/frontend-v3/.env.local
 ```
 
 Install modules
+
 ```
 pnpm install
 ```
 
 Then spin up the dev environment with:
+
 ```
 pnpm dev
 ```
@@ -57,35 +63,45 @@ pnpm build
 ### Testing
 
 To test all apps and packages, run:
+
 ```
 pnpm test:unit
 // or
 pnpm test:integration
 ```
 
 ### Install a package
-If you want to install a new npm package in a sub application like `frontend-v3`
-add the --filter option to your install command, e.g.:
+
+If you want to install a new npm package in a sub application like `frontend-v3` add the --filter
+option to your install command, e.g.:
+
 ```
 pnpm add some-pkg --filter=frontend-v3
 ```
+
 This filter should match the `name` attribute in the app or package package.json.
 
 ## Turborepo
 
 ### Remote Caching
 
-Turborepo can use a technique known as [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines.
+Turborepo can use a technique known as
+[Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) to share cache
+artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines.
 
-By default, Turborepo will cache locally. To enable Remote Caching you will need an account with Vercel. If you don't have an account you can [create one](https://vercel.com/signup), then enter the following commands:
+By default, Turborepo will cache locally. To enable Remote Caching you will need an account with
+Vercel. If you don't have an account you can [create one](https://vercel.com/signup), then enter the
+following commands:
 
 ```
 npx turbo login
 ```
 
-This will authenticate the Turborepo CLI with your [Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview).
+This will authenticate the Turborepo CLI with your
+[Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview).
 
-Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your Turborepo:
+Next, you can link your Turborepo to your Remote Cache by running the following command from the
+root of your Turborepo:
 
 ```
 npx turbo link

apps/beets-frontend-v3/.env.template

@@ -0,0 +1,15 @@
+NEXT_PUBLIC_APP_ENV=dev
+NEXT_PUBLIC_BALANCER_API_URL=https://api-v3.balancer.fi/graphql
+NEXT_PUBLIC_WALLET_CONNECT_ID=1b6b722470b504a53cf011e1e629a9eb
+
+# For wallet checks (optional)
+PRIVATE_HYPERNATIVE_API_ID=xxx
+PRIVATE_HYPERNATIVE_API_SECRET=xxx
+
+# For fiat currency conversions (optional)
+PRIVATE_CURRENCYAPI_KEY=xxx
+
+# For integration tests and rpc proxy routes (optional)
+NEXT_PRIVATE_ALCHEMY_KEY=xxx
+
+

apps/beets-frontend-v3/.env.test

@@ -0,0 +1,2 @@
+NEXT_PUBLIC_APP_ENV=test
+NEXT_PUBLIC_BALANCER_API_URL=https://api-v3.balancer.fi/graphql

apps/beets-frontend-v3/.eslintrc.js

@@ -0,0 +1,9 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: ['@repo/eslint-config/next.js'],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    project: true,
+  },
+}

apps/beets-frontend-v3/.gitignore

@@ -0,0 +1,48 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+.env
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+.vscode
+.idea
+
+# Sentry Config File
+.sentryclirc
+
+# GrapgQL Codegen
+/lib/shared/services/api/generated/
+
+# Sentry Config File
+.env.sentry-build-plugin

apps/beets-frontend-v3/.husky/pre-commit

@@ -0,0 +1 @@
+pnpm lint-staged --cwd apps/frontend-v3

apps/beets-frontend-v3/.prettierrc.json

@@ -0,0 +1 @@
+"@repo/prettier-config"

apps/beets-frontend-v3/.stylelintignore

@@ -0,0 +1 @@
+.next/

apps/beets-frontend-v3/README.md

@@ -0,0 +1,43 @@
+# Balancer frontend V3
+
+## Getting Started
+
+_This project uses `pnpm`, if you haven't already installed it you can find the documentation here:
+https://pnpm.io/installation_
+
+To setup the development environment, first clone the repo:
+
+```bash
+git clone https://github.com/balancer/frontend-v3.git && cd frontend-v3
+```
+
+Copy and rename the `.env.example` file to `.env.local`:
+
+```bash
+cp .env.example .env.local
+```
+
+Next, install dependencies:
+
+```bash
+pnpm install
+```
+
+Then, run the development server:
+
+```bash
+pnpm dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+## Testing
+
+See [TESTING.md](./test/TESTING.md).
+
+## Developing in Windows
+
+To develop in Windows you need to use WSL2. Learn more about it
+[here](https://learn.microsoft.com/en-us/windows/wsl/about).
+
+With WSL2 all environment variables will be correctly set without having to use `cross-env`.

apps/beets-frontend-v3/app/(app)/debug/alerts/page.tsx

@@ -0,0 +1,83 @@
+'use client'
+
+import { BalAlert } from '@repo/lib/shared/components/alerts/BalAlert'
+import { BalAlertButton } from '@repo/lib/shared/components/alerts/BalAlertButton'
+import { BalAlertContent } from '@repo/lib/shared/components/alerts/BalAlertContent'
+import { useGlobalAlerts } from '@repo/lib/shared/components/alerts/GlobalAlertsProvider'
+import { GenericError } from '@repo/lib/shared/components/errors/GenericError'
+import { Button, VStack } from '@chakra-ui/react'
+
+const exceptionName = 'Error fetching swap'
+const exceptionMessage = `Execution reverted for an unknown reason. Raw Call Arguments:
+to:0xE39B5e3B6D74016b2F6A9673D7d7493B6DF549d5
+Docs: https://viem.sh/docs/contract/simulateContract Details: execution reverted Version:
+[email protected]`
+
+class TestError extends Error {
+  constructor(name: string, message: string) {
+    super(message)
+    this.name = name
+  }
+}
+
+export default function Page() {
+  const { addAlert } = useGlobalAlerts()
+  return (
+    <VStack width="full">
+      <BalAlert content={<TitleWithButton title="Info alert" />} status="info" />
+      <BalAlert content={<TitleWithButton title="Warning alert" />} status="warning" />
+      <BalAlert content={<TitleWithButton title="Error alert" />} status="error" />
+      <BalAlert content={<TitleWithButton title="Success alert" />} status="success" />
+      <BalAlert
+        content="Warning alert with close button (soft warning)"
+        status="warning"
+        isSoftWarning
+      />
+      <BalAlert
+        content="Error alert with learn more button link"
+        learnMoreLink="https://balancer.fi"
+        status="error"
+      />
+      <BalAlert
+        content={
+          <BalAlertContent
+            title="Info alert"
+            description="With description in the next line (forceColumnMode)"
+            forceColumnMode
+          ></BalAlertContent>
+        }
+        status="info"
+      />
+
+      <GenericError
+        error={new TestError(exceptionName, exceptionMessage)}
+        maxWidth="500"
+      ></GenericError>
+
+      <Button
+        onClick={() =>
+          addAlert({
+            id: 'debugAlert',
+            title: 'Global warning alert:',
+            description: 'with global description',
+            status: 'warning',
+          })
+        }
+      >
+        Show global warning alert
+      </Button>
+    </VStack>
+  )
+}
+
+function TitleWithButton({ title }: { title: string }) {
+  return (
+    <BalAlertContent
+      title={title}
+      description="Optional description"
+      tooltipLabel="Optional tooltip"
+    >
+      <BalAlertButton onClick={() => console.log('Clicked')}>Click me</BalAlertButton>
+    </BalAlertContent>
+  )
+}

apps/beets-frontend-v3/app/(app)/debug/layout.tsx

@@ -0,0 +1,6 @@
+import { DefaultPageContainer } from '@repo/lib/shared/components/containers/DefaultPageContainer'
+import { PropsWithChildren } from 'react'
+
+export default function DebugLayout({ children }: PropsWithChildren) {
+  return <DefaultPageContainer>{children}</DefaultPageContainer>
+}