# SpriteDX - Purchase Credit Flow v0.1

Today, I spent whole day working on adding Purchase Credit Flow.

When user clicks on **Generate** button, **Unlock Generation** modal pops up asking for user to sign up.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769742696677/7213aa4a-d45d-4f12-b4b5-52db99c98da5.png align="center")

Once you **login**, you get free 100 bonus credit gifted to you.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743403374/daffe0ff-0043-41da-8051-e68310f953fb.png align="center")

Now, clicking on **Generate** to generate, and spends your credits.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743071366/97e2970b-3f3b-44c0-8858-9637045ec36f.png align="center")

Then, you can confirm your usage in **Usage and Billing**.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743036866/9f0b0ef0-55e7-4e5f-9560-edc9fb625895.png align="center")

You can **Buy Credit** using the user menu drop down.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743134978/9eb14790-207a-411e-af1d-4cfd17d0b8ee.png align="center")

Then it uses **Stripe** as credit card processor.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743464960/690bf90d-a08c-415f-a336-3ab66fa38d8e.png align="center")

Purchased credits show up in **Usage and Billing**.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743201821/2473888d-8366-4d5a-9382-ac0569166a75.png align="center")

For administration, we added a tool domain to manage accounts. For example, following account has been flagged as as “Test Billing Account“ which uses Stripe Sandbox environment. The production is able to figure out the user mode and route the traffic to the right environment.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743588791/73bc0a61-9055-43d5-a687-69e9c776ac61.png align="center")

Also, a debug page is available to test purchasing.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769743719936/4b3bd0a0-1ba7-425b-a57f-562d5b55e127.png align="center")

That’s it!

Billing is not turned on yet though. It will be on Early Access until we close the loop of remaining V1 features in SpriteDX.

— Sprited Dev 🐛