Commit Graph

9 Commits

Author SHA1 Message Date
Ubbe
5741331250 feat(frontend): logged out pages UI updates (#10314)
## Changes 🏗️

<img width="800" alt="Screenshot 2025-07-07 at 13 16 44"
src="https://github.com/user-attachments/assets/0d404958-d4c9-454d-b71a-9dd677fe0fdc"
/>

<img width="800" alt="Screenshot 2025-07-07 at 13 17 08"
src="https://github.com/user-attachments/assets/1142f6d5-a6af-485d-b42e-98afd26de3ed"
/>

Update the UI of the logged-out pages ( _login, signup,
reset-password..._ ) using the new Design System components, so the app
starts to look a bit more cohesive 💆🏽

Some notes:

- I refactored the `<AuthCard />` components a bit to be easier to use
- I split the render from hook login on login/signup
- I added a couple of modals to improve the UX when logging in with
Google or using non-whitelisted emails
  -  _see below my comments for more context_ 
- When there are API errors, they are shown in a toast to prevent the
layout of the form from jumping
- When using the components in the UI, an issue with border-radius, see
comments for an explanation




## Checklist 📋

### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  - [x] Logout on the platform
  - [x] Check the updated Login/Signup/Reset password pages
  - [x] The UI looks good and is consistent
  - [x]  The forms work as expected
2025-07-10 18:27:24 +00:00
Ubbe
6e253ecade docs(frontend): add design system overview page (#10157)
### Changes 🏗️

<img width="800" alt="Screenshot 2025-06-13 at 18 29 27"
src="https://github.com/user-attachments/assets/6a2f9c23-860f-4f92-8a7a-eeb7839940fd"
/>

- Add a nice overview page for the 👶🏽 baby AutoGPT design system
- Customise the logo on Storybook to show AutoGPT one

### Checklist 📋

#### For code changes:

- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  - [x] Run Storybook
  - [x] You see the Overview page which looks good
2025-06-13 15:10:32 +00:00
Krzysztof Czerwinski
9f2b9d08c9 feat(platform): Add Run 10 agents wallet task (#9937)
### Changes 🏗️

This PR adds `Run 10 agents` step to wallet tasks that can be done by
running any agents 10 times either from Library or Builder (onboarding
agent run also counts).

- Merge `Finish onboarding` and `See results` steps into one in the
wallet
- User is redirected directly to onboarding agent runs in Library after
congrats screen
- Add `RUN_AGENTS` step and `agentRuns` integer to schema and related
migration
- Running agent from Library and Builder increments `agentRuns`
- Open NPS survey popup when 10 agents are run
- Fix resuming onboarding on login when unfinished
- Remove no longer needed `get-results.mp4` tutorial video

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  - [x] Onboarding can be completed and proper reward is awarded
  - [x] `Run 10 agents` can be completed and reward is awarded
    - [x] When unning different agents and the same agent
    - [x] Running from library and builder counts
  - [x] Onboarding is resumed to last finished step on login
2025-05-28 07:40:52 +00:00
Nicholas Tindle
e8fa996c2f refactor(frontend): Move from remote loaded GTM to local (#9933)
<!-- Clearly explain the need for these changes: -->

As part of a small security review, we found that google won't let you
load with integrity. That seems insane but the general workaround is to
load a static copy of your own

### Changes 🏗️
Moves all the google analytics scripts in house instead of loading via
cdn
<!-- Concisely describe all of the changes made in this pull request:
-->

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  <!-- Put your test plan here: -->
- [x] tested it in a new isolated environment to confirm events still
work as expected everywhere they are used

---------

Co-authored-by: Reinier van der Leer <pwuts@agpt.co>
2025-05-14 16:07:40 +00:00
Krzysztof Czerwinski
d791cdea76 feat(platform): Onboarding Phase 2 (#9736)
### Changes 🏗️

- Update onboarding to give user rewards for completing steps
- Remove `canvas-confetti` lib and add `party-js` instead; the former
didn't allow to play confetti from a component
- Add onboarding videos in `frontend/public/onboarding/`
- Remove Balance (`CreditsCard.tsx`) and add openable `Wallet.tsx` (and
accompanying `WalletTaskGroup.tsx`) instead that displays grouped
onboarding tasks with descriptions and short instructional videos
- Further relevant updates to `useOnboarding`, `types.ts`
- Implement onboarding rewards
- Add `onboarding_reward` function in `credit.py` that is used to reward
user for finished onboarding tasks safely - transaction key is
deterministic, so the same user won't be rewarded twice for the same
step.
  - Add `reward_user` in `onboarding.py`
- Update `UserOnboarding` model and add a migration

<img width="464" alt="Screenshot 2025-04-05 at 6 06 29 PM"
src="https://github.com/user-attachments/assets/fca8d09e-0139-466b-b679-d24117ad01f0"
/>

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
  - [x] Onboarding works
  - [x] Tasks can be completed
  - [x] Rewards are added correctly for all completed tasks
2025-04-12 10:56:59 +00:00
Krzysztof Czerwinski
0b992223df feat(frontend): Onboarding flow UI (#9485)
### Changes 🏗️
This PR adds interactive UI for the onboarding flow, without any
connection to the backend.
Visit `/onboarding` to see it!

- Add Onboarding pages to `app/onboarding/`
- Add Onboarding components to `components/onboarding`

Note:
- Backend isn't connected, so the agents won't run and state isn't
preserved
- Onboarding state is lost on refresh

### Checklist 📋

#### For code changes:
- [ ] I have clearly listed my changes in the PR description
- [ ] I have made a test plan
- [ ] I have tested my changes according to the test plan:
  <!-- Put your test plan here: -->
  - [ ] ...
2025-02-21 16:07:27 +00:00
Krzysztof Czerwinski
6ec2bacb72 refactor(frontend): Update Supabase and backend API management (#9036)
Currently there are random issues (logout, auth desync) and
inconveniences with how Supabase and backend API works.
Resolves:
- https://github.com/Significant-Gravitas/AutoGPT/issues/9006
- https://github.com/Significant-Gravitas/AutoGPT/issues/8912

### Changes 🏗️

This PR streamlines how the Supabase and backend API is used to fix
current errors with auth, remove unnecessary code and make it easier to
use Supabase and backend API.

- Add `getServerSupabase` for server side that returns `SupabaseClient`.
- Add `Spinner` component that is used for loading animation.
- Remove redundant `useUser`, user is fetched in `useSupabase` already.
- Replace most Supabase `create*Client` to `getSupabaseServer` and
`useSupabase`.
- Remove redundant `AutoGPTServerAPI` class and rename
`BaseAutoGPTServerAPI` to `BackendAPI` and use it instead.
- Remove `SupabaseProvider` context; supabase caches internally what's
possible already.
- Move `useSupabase` hook to its own file and update it.

### Helpful table
| Next.js usage | Server | Client |
|---|---|---|
| API | `new BackendAPI();` | `new BackendAPI();`* or `useBackendAPI()`
|
| Supabase | `getServerSupabase();` | `useSupabase();` |
| user, user.role | `getServerUser();`** | `useSupabase();` |

\* `BackendAPI` automatically chooses correct Supabase client, so while
it's recommended to use `useBackendAPI()`, it's ok to use `new
BackendAPI();` in client components and even memoize it: `useMemo(() =>
new BackendAPI(), [])`.

** The reason user isn't returned in `getServerSupabase` is because it
forces async fetch but creating supabase doesn't, so it'd force
`getServerSupabase` to be async or return `{ supabase: SupabaseClient,
user: Promise<User> | null }`. For the same reason `useSupabase`
provides access to `supabase` immediately but `user` *may* be loading,
so there's `isUserLoading` provided as well.

### Checklist 📋

#### For code changes:
- [ ] I have clearly listed my changes in the PR description
- [ ] I have made a test plan
- [ ] I have tested my changes according to the test plan:
  <!-- Put your test plan here: -->
  - [ ] ...

<details>
  <summary>Example test plan</summary>
  
  - [ ] Create from scratch and execute an agent with at least 3 blocks
- [ ] Import an agent from file upload, and confirm it executes
correctly
  - [ ] Upload agent to marketplace
- [ ] Import an agent from marketplace and confirm it executes correctly
  - [ ] Edit an agent from monitor, and confirm it executes correctly
</details>

#### For configuration changes:
- [ ] `.env.example` is updated or already compatible with my changes
- [ ] `docker-compose.yml` is updated or already compatible with my
changes
- [ ] I have included a list of my configuration changes in the PR
description (under **Changes**)

<details>
  <summary>Examples of configuration changes</summary>

  - Changing ports
  - Adding new services that need to communicate with each other
  - Secrets or environment variable changes
  - New or infrastructure changes such as databases
</details>

---------

Co-authored-by: Aarushi <50577581+aarushik93@users.noreply.github.com>
Co-authored-by: Nicholas Tindle <nicholas.tindle@agpt.co>
2024-12-18 09:55:23 +00:00
Swifty
2de5e3dd83 feat(platform): Agent Store V2 (#8874)
# 🌎 Overview

AutoGPT Store Version 2 expands on the Pre-Store by enhancing agent
discovery, providing richer content presentation, and introducing new
user engagement features. The focus is on creating a visually appealing
and interactive marketplace that allows users to explore and evaluate
agents through images, videos, and detailed descriptions.

### Vision

To create a visually compelling and interactive open-source marketplace
for autonomous AI agents, where users can easily discover, evaluate, and
interact with agents through media-rich listings, ratings, and version
history.

### Objectives

📊 Incorporate visuals (icons, images, videos) into agent listings.
 Introduce a rating system and agent run count.
🔄 Provide version history and update logs from creators.
🔍 Improve user experience with advanced search and filtering features.

### Changes 🏗️

<!-- Concisely describe all of the changes made in this pull request:
-->

### Checklist 📋

#### For code changes:
- [ ] I have clearly listed my changes in the PR description
- [ ] I have made a test plan
- [ ] I have tested my changes according to the test plan:
  <!-- Put your test plan here: -->
  - [ ] ...

<details>
  <summary>Example test plan</summary>
  
  - [ ] Create from scratch and execute an agent with at least 3 blocks
- [ ] Import an agent from file upload, and confirm it executes
correctly
  - [ ] Upload agent to marketplace
- [ ] Import an agent from marketplace and confirm it executes correctly
  - [ ] Edit an agent from monitor, and confirm it executes correctly
</details>

#### For configuration changes:
- [ ] `.env.example` is updated or already compatible with my changes
- [ ] `docker-compose.yml` is updated or already compatible with my
changes
- [ ] I have included a list of my configuration changes in the PR
description (under **Changes**)

<details>
  <summary>Examples of configuration changes</summary>

  - Changing ports
  - Adding new services that need to communicate with each other
  - Secrets or environment variable changes
  - New or infrastructure changes such as databases
</details>

---------

Co-authored-by: Bently <tomnoon9@gmail.com>
Co-authored-by: Aarushi <aarushik93@gmail.com>
2024-12-13 16:35:02 +00:00
Swifty
ef7cfbb860 refactor: AutoGPT Platform Stealth Launch Repo Re-Org (#8113)
Restructuring the Repo to make it clear the difference between classic autogpt and the autogpt platform:
* Move the "classic" projects `autogpt`, `forge`, `frontend`, and `benchmark` into a `classic` folder
  * Also rename `autogpt` to `original_autogpt` for absolute clarity
* Rename `rnd/` to `autogpt_platform/`
  * `rnd/autogpt_builder` -> `autogpt_platform/frontend`
  * `rnd/autogpt_server` -> `autogpt_platform/backend`
* Adjust any paths accordingly
2024-09-20 16:50:43 +02:00