## Best Practices
* **Push regularly** to keep your GitHub branch updated
* **Complete and merge** one feature before creating another
* Structure larger projects as multiple feature canvases instead of developing everything in a single branch
By following these steps, you'll ensure smooth collaboration and maintain a clean project history.
# Github Organizations
Source: https://tempolabsinc.mintlify.app/Basics/GitOrgs
Tempo now integrates directly with GitHub Organizations, empowering your team to seamlessly collaborate and push AI projects faster.
We're excited to announce GitHub Organizations integration in Tempo!
Unlike most AI software platforms built solely for individual workflows, Tempo is designed for team collaboration from the ground up.
With this new integration, you can effortlessly push Tempo projects directly into your GitHub organization, making team collaboration smoother, faster, and more efficient.
Check out the video walkthrough below to see exactly how easy it is to start collaborating on AI projects with your entire team.
# Keyboard Shortcuts
Source: https://tempolabsinc.mintlify.app/Basics/Keyboard Shortcuts
Speed up your workflow with keyboard shortcuts
## Navigation
| Shortcut | Action |
| ------------------------------------------------- | -------------------------- |
| Ctrl/Cmd+Shift+D | Back to dashboard |
| Alt+1 | Switch to Dom Tree |
| Alt+2 | Switch to Assets |
| Alt+3 | Switch to Community |
| Alt+4 | Switch to File Selector |
| Alt+5 | Switch to Git Settings |
| Alt+6 | Switch to History |
| Alt+7 | Switch to App Store |
| Alt+8 | Switch to Info |
| Alt+9 | Switch to Project Settings |
## Zoom
| Shortcut | Action |
| -------------------------------- | ----------------- |
| Ctrl/Cmd+= | Zoom in |
| Ctrl/Cmd+- | Zoom out |
| Ctrl/Cmd+0 | Reset zoom |
| Shift+1 | Zoom to fit |
| Shift+2 | Zoom to selection |
## Selection
| Shortcut | Action |
| -------------------------------- | ----------------------- |
| Ctrl/Cmd+A | Select all elements |
| Tab | Select next sibling |
| Shift+Tab | Select previous sibling |
| \\ | Select parent |
| Esc | Clear selection |
## Tools
| Shortcut | Action |
| ------------ | ------------------------- |
| A | AI tool |
| V | Select tool |
| T | Text tool |
| H | Hand tool |
| F | Draw tool |
| G | Generate image |
| X | Switch to light/dark mode |
| D | Design/Interactive mode |
## Text Formatting
| Shortcut | Action |
| ------------------------------------------------- | ----------------------- |
| Ctrl/Cmd+B | Toggle bold |
| Ctrl/Cmd+I | Toggle italic |
| Ctrl/Cmd+U | Toggle underline |
| Ctrl/Cmd+Shift+X | Toggle strikethrough |
| Ctrl/Cmd+Alt+L | Text align left |
| Ctrl/Cmd+Alt+T | Text align center |
| Ctrl/Cmd+Alt+R | Text align right |
| Ctrl/Cmd+Alt+J | Text align justified |
| Shift+Ctrl/Cmd+, | Decrease font size |
| Shift+Ctrl/Cmd+. | Increase font size |
| Ctrl/Cmd+Alt+, | Decrease font weight |
| Ctrl/Cmd+Alt+. | Increase font weight |
| Alt+, | Decrease letter spacing |
| Alt+. | Increase letter spacing |
| Shift+Alt+, | Decrease line height |
| Shift+Alt+. | Increase line height |
## Layout & Style
| Shortcut | Action |
| -------------------------------------------- | ------------------ |
| Shift+A | Add auto layout |
| Alt+Shift+A | Remove auto layout |
| Alt+/ | Remove fill |
| Shift+/ | Remove stroke |
## Canvas Actions
| Shortcut | Action |
| ------------------------------------------------- | -------------------------------------- |
| Ctrl/Cmd+Z | Undo |
| Ctrl/Cmd+Shift+Z | Redo |
| Ctrl/Cmd+D | Duplicate selected element |
| Backspace | Delete selected element |
| Ctrl/Cmd+Alt+K | Create component from selected element |
| Ctrl/Cmd+Alt+B | Detach component instance |
| Ctrl/Cmd+Alt+G | Group (wrap) selected elements |
| Ctrl/Cmd+Shift+R | Paste to replace selected elements |
## Positioning
| Shortcut | Action |
| ----------------------------- | ------------------- |
| ← | Nudge left |
| → | Nudge right |
| ↑ | Nudge up |
| ↓ | Nudge down |
| Shift+← | Nudge left (large) |
| Shift+→ | Nudge right (large) |
| Shift+↑ | Nudge up (large) |
| Shift+↓ | Nudge down (large) |
# Local Mode (Tempo <> Windsurf or Cursor)
Source: https://tempolabsinc.mintlify.app/Basics/LocalMode
Local Mode syncs your Tempo project with your IDE in real time—no ZIPs, no Git.
**Local Mode** bridges the gap between your favorite IDE and the power of Tempo.
Instead of juggling ZIP downloads or the constant push/pull routine with GitHub, Local Mode enables real-time, 2-way sync between Tempo and editors like VS Code, Cursor, or Windsurf.
Whether you're coding solo or collaborating with AI, changes made in your IDE are instantly reflected in Tempo—and vice versa. No friction, no hacks—just smooth, seamless collaboration that keeps your project in perfect sync. Work where you want.
Ship how you want. Welcome to Local Mode.
# Prompting in Tempo
Source: https://tempolabsinc.mintlify.app/Basics/Prompting
Learn effective prompting strategies to make the most out of Tempo
## Overview
Unlock the full potential of Tempo with these tried-and-tested prompting techniques.
These methods, drawn from our team’s experiences and user insights, can help you guide the AI to produce more precise and impactful results.
### What is prompting?
Prompting is the process of giving written instructions to the AI to shape your project. Think of it as an interactive conversation—your prompts guide the AI to build or refine specific aspects of your design.
Since Tempo utilizes advanced language models, the way you frame your requests can significantly influence the output. Taking time to craft clear, detailed prompts ensures you achieve optimal results.
## Use your Mouse to Guide AI
One of Tempos’ standout features is the ability to click directly on individual components within the Canvas. This tells the AI exactly which element you’d like to update, and your selection appears in the chat to ensure clarity.
## Prompting strategies
Below are a range of techniques to help you achieve the best results. These approaches are flexible—experiment with them and combine methods to suit your project’s needs.
### Setting the Scene with Context
Providing relevant background information helps the AI better understand your requirements before diving into specifics.
Example Prompt:
```md theme={null}
I’m working on a collaborative tool to help teams manage their projects. Here are the key features I’d like to include:
- User sign-up and authentication
- Project dashboards
- Task tracking and assignment
- Progress reporting
Start by designing the project dashboard.
```
### Incremental prompting
Instead of overwhelming the AI with a large, complex task, break it into smaller, manageable steps. Incremental instructions often yield better, more accurate results.
**Instead of:**
*"Create a CRM app with authentication,Google Sheets export, and data enrichment."*
**Try these prompts sequentially:**
```md theme={null}
1. Set up a basic CRM interface
2. Add user authentication features.
3. Enable Google Sheets export functionality.
4. Incorporate data enrichment from an external service
```
### Image Prompts
Tempo supports uploading images to guide the AI.
Whether it’s a design layout or a wireframe, adding detailed instructions alongside visuals can enhance results.
**Detailed Visual Prompt**
```md theme={null}
Based on the attached image, build a Kanban board.
Include features to add and reorder cards within columns, and move cards between columns.
Use drag-and-drop functionality, leveraging libraries like Pangea home-dnd.
```
### Avoid Vague Prompts
Vague instructions can lead to subpar results. Being specific and thorough helps the AI deliver what you envision.
**Avoid**
*"Build a form"*
**Instead use:**
```md theme={null}
Design a form with input fields for name, email, and phone number.
Ensure form validation and include a “Submit” button.
```
### Prompt with constraints
Constraints can help focus the AI’s attention on what’s most important and avoid unnecessary complexity.
**Example with Constraints:**
```md theme={null}
Create a task manager that shows up to three tasks at a time, with options to add, edit, and delete tasks.
```
### Fixing Errors with Prompts
When problems arise, the AI is more likely to fix them if you describe the issue in detail.
**Avoid:**
*"The project is broken. Fix it."*
**Better:**
```md theme={null}
The screen went blank after the last edit.
It was functional before. Can you investigate and restore the previous state?
```
For more detailed documentation, refer to [Prompting Best Practices](https://tempolabsinc.mintlify.app/Best%20Practices/Level%20Up%20Your%20Prompting%20Game)
# Restart Server
Source: https://tempolabsinc.mintlify.app/Basics/RestartServer
How to restart your server in Tempo
Sometimes, the simplest fix is to turn it **OFF** and then turn it **back ON**.
Now, you can do exactly that in Tempo with the new **"Restart Project"** feature.
Whether you’re troubleshooting an issue or just want a fresh start, restarting your project is now just a click away.
Here’s how it works 👇
# Starter Repo and Github Integration
Source: https://tempolabsinc.mintlify.app/Basics/Starter Repo and Github Integration
Connect your project to GitHub and version control
Tempo supports git-backed projects, allowing you to push and pull changes seamlessly between your local Canvas and a GitHub repository.
## Connecting a Project to GitHub
Syncing your Tempo project with GitHub is quick and straightforward:
1. In Tempo, navigate to the Git Settings tab.
2. Select Create a Repository and name your repo.
3. When prompted, install the GitHub App to enable integration.
4. Authorize and Refresh
5. Return to the main screen and refresh your permissions to complete the setup.
## Adding Media
You can add images and videos using two primary methods:
1. Uploading media directly to your connected GitHub repository.
2. Referencing media hosted at external URLs.
## Using an external image URL
You can use images/videos hosted on platforms like Unsplash, Imgur, Youtube or similar services.
This is a quick and convenient method, but keep the following in mind:
1. Ensure you have the appropriate usage rights for any image.
2. Some servers may block external usage with a feature called CORS, which might prevent the image from loading.
**Steps to Add an External Media:**
1. Find an image/video on your preferred platform (e.g., Unsplash, Youtube).
2. Copy the image/video's URL.
3. Use the URL in your project prompt. For example:
```md theme={null}
"Add a hero section image using the following URL: https://upload.wikimedia.org/wikipedia/commons/thumb/7/73/Pale_Blue_Dot.png/442px-Pale_Blue_Dot.png
```
## Using video and images from your GitHub *public* directory
For projects connected to GitHub, you can upload media to your repository's public folder and reference them in your Tempo prompts.
1. Connect your repository and make sure your project is synced with GitHub.
2. Navigate to the public folder in your repository.
3. Click Add File → Upload Files.
4. Drag and drop your image/video into the public folder or use the Choose Your Files option to upload manually.
5. Write a commit message (e.g., "Add images for app use").
6. Click Commit Changes to save the file.
7. Select the uploaded file and click on the copy icon next to the file name to copy the image’s path.
8. Reference the image in your Tempo prompt, e.g., "Add a hero section image from my repository: public/my-image.jpg."
Was this page helpful? [Yes](#) | [No](#) # Vite + Clerk + Convex + Stripe Source: https://tempolabsinc.mintlify.app/ViteClerkConvexStripe Step-by-step guide to configuring a SaaS app with Vite for the frontend, Clerk + Convex for auth/database, and Stripe for payments. # Overview In this tutorial, we’ll create a SaaS application using **Vite** for the front end, **Clerk + Convex** for authentication and database logic, and **Stripe** for handling payments. Follow the steps below to get everything up and running. ## Video Tutorial # Building a Vite SaaS App with Clerk, Convex, and Stripe Using Tempo This comprehensive guide walks you through creating a full-stack SaaS application using Vite for the frontend, Clerk for authentication, Convex for database functionality, and Stripe for payment processing—all orchestrated through Tempo's app generation platform. ## Prerequisites * A Tempo account (sign up at [tempo.new](https://tempo.new) if needed) * A Clerk account for authentication (free tier works for development) * A Convex account for database functionality * A Stripe account (we'll use Test Mode for development) * Basic understanding of web development concepts ## 1. Generate Your App in Tempo Tempo provides a streamlined way to create complex applications by automating service integrations and boilerplate setup. 1. Log in to your Tempo dashboard and click **Generate an App**. 2. Select **Vite** as your frontend framework. * Vite offers an extremely fast development experience with instant server start * It's optimized for modern JavaScript frameworks with hot module replacement * Includes built-in TypeScript support and other development features 3. Under **Auth & Database**, choose **Clerk + Convex**. * Clerk provides authentication, user management, and session handling * Convex offers a real-time database with serverless functions * This combination provides a complete backend solution with minimal configuration 4. Under **Payments**, select **Stripe**. * Stripe provides robust payment processing capabilities * Includes subscription management, invoicing, and payment handling * Test mode allows you to simulate the full payment flow without real transactions 5. Click **Setup Integrations** to begin configuring each service. * This initiates the app generation process * You'll need to provide API keys for each service in the following steps > **Note:** You'll need accounts with each service before proceeding. If you haven't created these accounts yet, you'll do so in the following steps. *** ## 2. Configure Clerk Clerk provides authentication and user management with a developer-friendly interface and secure defaults. ### Create a Clerk Application 1. Go to [Clerk](https://clerk.com/) and **create an account** if you haven't already. * You can sign up using GitHub, Google, or email * The free tier includes generous limits for development and testing 2. In the Clerk Dashboard, click **Add Application**: * Enter a name for your application (e.g., "Vite Application") * Select your preferred authentication methods: * Email/password for traditional login * Social providers like Google, GitHub, or Discord for easier onboarding * Consider your target audience when selecting providers * Choose your development environment (typically "Development" for now) * Click "Create Application" ### Obtain Your API Key 1. After creating your application, locate your API keys: * In your newly created application, find the "Set up your Clerk Keys" section * Look for the line with your **Publishable Key** (starts with `pk_test_` for development) * Copy **only the key value** after the `=` sign, not including the variable name or quotes * Paste this key into Tempo when prompted ### Create a JWT Template for Convex 1. In the Clerk dashboard, navigate to **JWT Templates**: * Click on **Configure** in the top navbar * Select **JWT Templates** * Click **New Template** * Click on the **Convex template** * Leave all default settings as is (the default template works fine with Convex) * Click **Save** to create the template * Keep this page open, as you'll need the **Issuer URL** in the next section > **Important:** The JWT template you select NEEDs to be Convex, as this is what the integration expects. ## 3. Configure Convex Convex provides a real-time database with serverless functions that automatically sync data to all connected clients. ### Create a Convex Project 1. Go to [Convex Dashboard](https://dashboard.convex.dev/) and log in or create an account. * You can authenticate with GitHub, Google, or email * New accounts include a free tier sufficient for development 2. Click **New Project** to create a new project: * Name your project (e.g., "Vite App") * Select your preferred region (ideally close to your target users) * Click "Create Project" ### Obtain API Keys and URLs 1. Once your project is created, go to **Settings** → **URL & Deploy Key**: * Copy the **Deployment URL** (looks like [)](https://example-123.convex.cloud\)) * Paste this URL into Tempo in the appropriate field * Click **+ Generate Development Deploy Key** * Give your key a name (e.g., "V" or "Tempo Integration") * Copy the generated key * Paste it into Tempo when prompted ### Configure Clerk Authentication in Convex 1. To enable Clerk authentication with Convex: * Return to your Clerk dashboard and find the JWT template you created * Copy the **Issuer** URL (looks like [)](https://clerk.your-app.accounts.dev\)) * Go back to Convex → **Settings** → **Environment Variables** * Add a new environment variable: ``` CLERK_SIGNING_KEY=
Was this page helpful? [Yes](#) | [No](#) # Vite + Supabase + Polar Source: https://tempolabsinc.mintlify.app/ViteSupabasePolar Step-by-step guide to creating a SaaS app with Vite for the frontend, Supabase for database/auth, and Polar for payments. # Overview In this tutorial, you’ll learn how to create a SaaS application using **Vite** for the frontend, **Supabase** for database/auth, and **Polar** for payment processing. Follow these steps to get your app up and running quickly. ## Video Tutorial *** # Building a Vite SaaS App with Supabase and Polar Using Tempo This comprehensive guide walks you through creating a full-stack SaaS application using Vite as the frontend framework, Supabase for authentication and database functionality, and Polar for payment processing—all orchestrated through Tempo's app generation platform. ## Prerequisites * A Tempo account (sign up at [tempo.build](https://tempo.build) if needed) * A Supabase account (free tier works fine for development) * A Polar sandbox account for test payments * Basic understanding of web development concepts ## 1. Generate an App in Tempo Tempo provides a streamlined way to create production-ready applications with integrated services. 1. Log in to your Tempo dashboard and click **Generate an App**. 2. Select **Vite** as your framework. * Vite offers extremely fast development with instant hot module replacement * It's optimized for modern JavaScript/TypeScript applications * Provides a leaner, more performant alternative to Create React App 3. Under **Auth & Database**, choose **Supabase**. * Supabase combines PostgreSQL database functionality with authentication * Includes row-level security and real-time data subscriptions * Provides storage capabilities and serverless functions 4. Under **Payments**, choose **Polar**. * Polar offers subscription management and payment processing * The sandbox environment lets you test without real transactions * Includes webhook support for event-driven functionality 5. Click **Setup Integrations** to proceed to the configuration step. * This initiates the project scaffolding process * You'll now need to configure each service integration > **Note:** Before proceeding, ensure you have accounts for each service or be prepared to create them in the following steps. *** ## 2. Connect Supabase Supabase serves as both your authentication provider and database, offering a PostgreSQL database with built-in auth functionality. ### Create a Supabase Project 1. Go to [Supabase.com](https://supabase.com/) and **create an account** if you haven't already. * You can sign up with GitHub, GitLab, or email * The free tier includes generous limits for development purposes 2. **Create an Organization** if you're new to Supabase: * Click on "New Organization" in the dashboard * Enter an organization name (e.g., "My SaaS Projects") * Click "Create organization" 3. Create a **New Project** within your organization: * Click the "New project" button * Select your organization * Name your project (e.g., "SAS Polar") * Create a secure database password (store this safely) * Choose a region closest to your target users * Select the free plan for development * Click "Create new project" * Wait for provisioning (usually takes 1-2 minutes) ### Connect Supabase to Tempo 1. Return to Tempo and click **Connect Supabase**: * This opens an authorization window * Click "Authorize" to allow Tempo to access your Supabase account * This permission is necessary for Tempo to set up tables and deploy functions 2. After authorization, select your newly created project from the dropdown menu and click **Connect**. * Tempo will verify the connection * Once verified, you'll see a success message > **Note:** This connection allows Tempo to create the necessary database tables, set up authentication rules, and deploy edge functions to handle various aspects of your application. *** ## 3. Configure Polar (Test Environment) Polar provides subscription management and payment processing. The sandbox environment allows you to test the complete payment flow without processing real transactions. ### Create a Polar Sandbox Account 1. Go to [sandbox.polar.sh](https://sandbox.polar.sh/) to access the test environment. * The sandbox is completely separate from the production environment * All transactions here are simulated 2. **Create an Account** if you don't have one: * Sign up with GitHub, Google, or email * The sandbox is free to use for development and testing 3. After logging in, **Create a New Organization**: * Click on "Create organization" * Enter a name for your organization (e.g., "vPolar") * Choose "Sandbox" as the account type * Click "Create organization" 4. Find your organization identifier: * Navigate to **Settings** → **Organization** * Copy your **Organization Identifier** (an alphanumeric string) * Return to Tempo and paste it in the **Polar Organization ID** field ### Generate a Polar Access Token Access tokens allow your application to communicate securely with Polar's API. 1. In Polar, navigate to **Settings** → **Developers** → **Access Tokens**: * Click **New Token** * Give it a descriptive name (e.g., "test token") * Set **No Expiration** to avoid token renewal issues * Select **All** scopes to ensure full functionality * Click **Create** 2. Copy the generated token (you won't be able to view it again): * Return to Tempo * Paste the token into the **Polar Access Token** field ### Set Up Polar Webhook Webhooks allow Polar to notify your application about events like new subscriptions, cancellations, and payment status changes. 1. In Tempo, copy the **Polar Webhook URL** displayed on the integration screen. 2. In Polar, navigate to **Settings** → **Developers** → **Webhooks**: * Click **Add Endpoint** * Paste the webhook URL from Tempo * Set the **Format** to **RAW** (important for correct data processing) * Select **All** events to receive all notifications * Click **Generate** to create a webhook secret 3. Copy the generated **secret** key: * Return to Tempo * Paste it into the **Polar Webhook Secret** field * Click **Create** in Polar to finalize the webhook setup ### Create a Polar Product Products define what your customers can subscribe to in your application. 1. In Polar, navigate to **Products**: * Click **New Product** * Enter a name (e.g., "Test Subscription" or "Premium Plan") * Add a description explaining the features * Set a price (e.g., \$10/month) * Configure any trial periods if desired * Click **Create** to save your product 2. Return to Tempo and click **Refresh**: * Your newly created product should appear in the list * This confirms that the Polar integration is working correctly > **Tip:** Create multiple products with different price points to test tiered subscription options in your application. *** ## 4. Run and Build Your App Now that you've configured both Supabase and Polar, you're ready to generate your application. 1. Review your configurations and click **Setup Integrations** in Tempo. 2. Prompt what you want the AI to build and hit **Next,** Tempo will now automatically set up your project 3. Tempo will now automatically set up your project infrastructure: * **Database setup**: * Runs Supabase migrations to create necessary tables * Sets up authentication tables and policies * Creates schema for users, profiles, and subscriptions * **Edge Functions deployment**: * Deploys serverless functions to handle Polar webhooks * Sets up subscription management logic * Creates user provisioning workflows * **Application generation**: * Builds the Vite application with all integrations * Configures environment variables and API connections * Sets up authentication flows and protected routes 4. Monitor the build process in the Tempo logs: * You'll see real-time updates as each step completes * The process typically takes 3-5 minutes * If any errors occur, the logs will provide details for troubleshooting ### Verify in Supabase While Tempo is building your application, you can verify the changes in your Supabase project: 1. Go to your **Supabase Dashboard** and open your project. 2. Navigate to **Table Editor**: * You should see several new tables created: * `auth.users` for authentication * `public.profiles` for user information * `public.subscriptions` for subscription tracking * Other tables specific to your selected template 3. Check **Edge Functions** under the "Functions" tab: * You should see functions deployed moments ago * These functions handle webhooks, user provisioning, and payment processing > **Note:** If you don't see these changes immediately, wait a few minutes as Tempo might still be applying the migrations. *** ## 5. Test Your Application Once your application is deployed, it's essential to test the complete user journey to ensure everything works correctly. ### Access Your Application 1. When the build process completes, click the **View** button in Tempo to open your application in a new browser tab. * This launches your application at a temporary URL provided by Tempo ### Test User Authentication 1. **Sign Up** for a new account: * Click the "Sign Up" or "Register" button on the landing page * Enter your name, email address, and create a password * Submit the form to create your account * Check your email inbox for a confirmation message from Supabase * Click the link in the email to verify your account 2. **Sign In** with your new credentials: * Return to the application * Click the "Sign In" or "Login" button * Enter your email and password * Click to sign in * You should be redirected to the dashboard or main application screen ### Test Payment Processing 1. Access subscription options: * Navigate to a "Pricing" or "Subscription" page * Alternatively, try accessing a premium feature, which should prompt you to subscribe 2. Subscribe to your test product: * Select the plan you created in Polar * Click "Subscribe" or "Get Started" * You'll be redirected to a checkout page 3. Complete the test payment: * Use a test credit card number: `4242 4242 4242 4242` * Enter any future expiration date (e.g., 12/29) * Use any three-digit CVC * Enter any name and billing address * Click "Pay" or "Subscribe" to process the payment 4. Verify successful subscription: * You should be redirected back to your application * You should now have access to premium features * The UI should update to reflect your subscription status ### Verify Data in Supabase After completing the payment, check your Supabase database to confirm everything was recorded correctly: 1. Return to your **Supabase Dashboard** and navigate to **Table Editor**. 2. Check the **Subscriptions** table: * You should see a new record with your user ID * The status should be "active" * It should reference the Polar product you subscribed to * Start and end dates should be properly set 3. Look for **webhook events** in a related table (if your template records these): * These events track the subscription lifecycle * You might see events like "subscription.created" > **Troubleshooting:** If your subscription isn't appearing, check the Polar webhook configuration. You can view webhook delivery attempts in Polar's dashboard under Settings → Developers → Webhooks. *** ## Summary You've successfully built a complete SaaS application with: * **Vite** for a modern, fast frontend experience * **Supabase** for authentication and database functionality * **Polar** for subscription billing and payment processing This integrated stack provides everything you need for a modern SaaS application: * User authentication and account management * Secure database operations with row-level security * Subscription billing and management * Webhook processing for payment events * A responsive UI with modern design patterns By using Tempo to orchestrate these services, you've saved countless hours of integration work. Instead of spending weeks connecting these services manually, you can now focus on building the unique features that make your SaaS valuable to users. ### Additional Resources * [Vite Documentation](https://vitejs.dev/guide/) * [Supabase Documentation](https://supabase.com/docs) * [Polar API Reference](https://docs.polar.sh) Good luck with your SaaS project!
Was this page helpful? [Yes](#) | [No](#) # Vite + Supabase + Stripe Source: https://tempolabsinc.mintlify.app/ViteSupabaseStripe Quick guide to creating a SaaS app with Vite, Supabase, and Stripe # Overview In this tutorial, you'll learn how to create a new SaaS application using **Vite**, **Supabase** for database & auth, and **Stripe** for payments. Follow these steps to get your app up and running in minutes. ## Video Tutorial # Building a SaaS App with Supabase and Stripe Using Tempo This comprehensive guide walks you through creating a complete SaaS application using Tempo's integration platform, with Supabase handling database and authentication functionality, and Stripe managing payment processing. ## Prerequisites * A Tempo account (sign up at [tempo.build](https://tempo.build) if needed) * A Supabase account (free tier works for development) * A Stripe account (we'll use Test Mode for development) * Basic understanding of web development concepts ## 1. Generate an App in Tempo Tempo streamlines the creation of fully-functional SaaS applications by automating the integration of various services. 1. Log in to your Tempo dashboard and click **Generate an App**. 2. From the available framework options, select your preferred frontend framework: * Next.js, Vite, React, or other options may be available * Each framework offers different advantages for SaaS development * The rest of this guide works with any of the framework options 3. Under **Database & Auth**, select **Supabase**. * Supabase provides PostgreSQL database functionality with built-in authentication * Includes row-level security policies for data protection * Offers real-time subscriptions and edge functions 4. Under **Payments**, select **Stripe**. * Stripe handles payment processing, subscription management, and invoicing * The integration sets up webhooks for event handling * Test mode allows you to simulate transactions without real money 5. Click **Setup Integrations** to proceed to the next step. * This initiates the project configuration process * You'll need to provide API keys for each service in the following steps > **Note:** The specific framework options may vary based on Tempo's current offerings. The integration process remains similar regardless of which frontend framework you choose. *** ## 2. Connect Supabase Supabase serves as both your database and authentication provider, offering a PostgreSQL database with built-in auth functionality. ### Create a Supabase Project 1. Go to [Supabase.com](https://supabase.com/) and create an account if you haven't already: * You can sign up with GitHub, GitLab, or email * The free tier includes generous limits for development purposes 2. Create a new organization (if you're new to Supabase): * Click "New organization" in the dashboard * Enter an organization name (e.g., "My SaaS Projects") * Click "Create organization" 3. Create a new project within your organization: * Click the "New project" button * Select your organization * Name your project (e.g., "Test SAS") * Create a secure database password (store this safely) * Choose a region closest to your target users * Select the free plan for development * Click "Create new project" * Wait for provisioning (usually takes 1-2 minutes) ### Connect Supabase to Tempo 1. Return to Tempo and click **Connect Supabase**: * This opens an authorization window * Click "Authorize" to allow Tempo to access your Supabase organization * This permission is necessary for Tempo to set up tables and deploy functions 2. After authorization, select your newly created project from the dropdown and click **Connect**. * Tempo will verify the connection * You'll see a success message when the connection is established > **Important:** The integration requires Tempo to have access to your Supabase project to create database tables, authentication settings, and storage buckets. All access is used solely for setting up your application. *** ## 3. Configure Stripe Stripe provides payment processing for your application. Using Test Mode lets you simulate the entire payment flow without real transactions. ### Access Stripe Dashboard 1. Go to [Stripe.com](https://stripe.com/) and create an account or log in to your existing account. 2. Ensure **Test Mode** is enabled: * Look for the toggle in the top-right corner of your Stripe Dashboard * It should display "Test Mode" with a purple background * This ensures all transactions are simulated without real money ### Obtain API Keys 1. In your Stripe Dashboard, navigate to **Developers** → **API keys**: * You'll see your **Publishable Key** (starts with `pk_test_`) * You'll also see your **Secret Key** (starts with `sk_test_`) * Copy each key and paste them into the corresponding fields in Tempo * The publishable key is safe for client-side code * The secret key must be kept confidential and used only in server-side code ### Set Up Stripe Webhook Webhooks allow Stripe to notify your application about events like successful payments, subscription changes, or payment failures. 1. In Tempo, locate and copy the **Stripe Webhook URL** provided: * This URL is specifically generated for your application * It points to an edge function that will process webhook events 2. In your Stripe dashboard, go to **Developers** → **Webhooks** → **Add endpoint**: * Paste the Tempo-provided webhook URL into the "Endpoint URL" field * Under "Select events to listen to": * For development, select **all events** for simplicity * For production, you might want to select only relevant events like: * `customer.subscription.created` * `customer.subscription.updated` * `customer.subscription.deleted` * `invoice.payment_succeeded` * `invoice.payment_failed` * Click **Add endpoint** to create the webhook 3. After creating the webhook: * Click on the newly created endpoint * Scroll down to "Signing secret" and click **Reveal** * Copy this secret and paste it into Tempo as your **Stripe Webhook Secret** * This secret ensures that webhook requests genuinely come from Stripe ### Create Products and Prices 1. To set up subscription products for your SaaS: * In Stripe, navigate to **Products** → **Add product** * Create at least one product with: * A descriptive name (e.g., "Premium Plan") * A description of features * A recurring price (e.g., \$9.99/month) * Click **Save product** to create it 2. Return to Tempo and click **Refresh Products** to verify Stripe products are recognized: * Tempo should display any products you've created * If they don't appear immediately, wait a moment and try refreshing again > **Note:** Creating products in Stripe is optional at this stage. You can also create them later directly from your application's admin interface once it's set up. *** ## 4. Generate Your SaaS Application Now that you've configured both Supabase and Stripe, you're ready to generate your application. 1. Review your configurations in Tempo and click **Setup Integrations**. 2. Prompt what you want the AI to build and hit **Next,** Tempo will now automatically set up your project 3. Monitor the build process as Tempo automatically: * **Runs Supabase migrations** to create necessary database tables: * Users table for authentication * Profiles table for user details * Subscriptions table to track payment status * Products table to store your Stripe products * Any other tables specific to your chosen template * **Deploys Edge Functions** to handle: * Webhook processing for Stripe events * Subscription management logic * User provisioning and role assignment * **Generates application code** with all integrations pre-configured: * Authentication flows (sign up, sign in, password reset) * Subscription management UI * Admin dashboard (if included in your template) * Customer-facing features based on your template 4. The build process typically takes 3-5 minutes to complete: * You can follow the progress in the console log * Tempo will notify you when the build is complete > **Note:** During this process, Tempo is not only generating code but also provisioning the necessary infrastructure and configuring the services to work together seamlessly. *** ## 5. Test Your Application Once your application is deployed, it's essential to test the complete user journey to ensure everything works correctly. ### Access Your Application 1. When the build process completes, click the **Play** button (Preview) to open your application in a new browser tab. * This launches your application at a temporary URL provided by Tempo ### Test User Authentication 1. **Sign Up** for a new account: * Click the "Sign Up" or "Register" button on the landing page * Enter your name, email address, and create a password * Submit the form to create your account * Check your email inbox for a confirmation message from Supabase * Click the link in the email to verify your account 2. **Sign In** with your new credentials: * Return to the application * Click the "Sign In" or "Login" button * Enter your email and password * Click to sign in * You should be redirected to the dashboard or main application screen ### Test Payment Processing 1. Find the subscription or pricing section: * This might be accessible from the dashboard * Look for a "Pricing," "Plans," or "Subscribe" button * Review the available plans (these should match what you created in Stripe) 2. Subscribe to a plan: * Select a plan that suits your testing needs * Click "Subscribe" or "Get Started" * You'll be redirected to a Stripe checkout page 3. Complete the test payment: * For testing, use Stripe's test card: `4242 4242 4242 4242` * Enter any future expiration date (e.g., 12/29) * Use any three-digit CVC * Enter any name and billing address * Click "Pay" or "Subscribe" to process the payment 4. Verify successful subscription: * You should be redirected back to your application * You should now have access to premium features * The UI should update to reflect your subscription status ### Verify Data in Supabase After completing the payment, check your Supabase database to confirm everything was recorded correctly: 1. Go to your **Supabase Dashboard** and navigate to **Table Editor**. 2. Check the following tables: * **Subscriptions**: * You should see a new record with your user ID * The status should be "active" * It should reference the Stripe product you subscribed to * Start and end dates should be properly set * **Users**: * Your user record should include basic profile information * Email verification status should be true * **Webhook Events** (if your template records these): * You might see recent events related to your subscription > **Troubleshooting:** If your subscription isn't appearing, check the Stripe webhook configuration. You can view webhook delivery attempts in the Stripe dashboard under Developers → Webhooks → Events. *** ## 6. What's Next? Customization and Development Now that you have a functioning SaaS application, you can begin customizing it to meet your specific needs. ### Explore Your Application 1. **Review the generated code**: * In Tempo, look for options to view or edit your code * Familiarize yourself with the project structure * Understand how authentication, database, and payment integrations are implemented 2. **Examine the database structure**: * In Supabase's Table Editor, review all tables and their relationships * Understand the data model and how it supports your application features 3. **Test the full user journey**: * Create multiple test accounts * Subscribe to different plans * Test upgrading and downgrading subscriptions * Test cancellations and renewals ### Customize Your Application 1. **Brand identity**: * Update logos, colors, and typography * Modify landing page content and marketing messages * Customize email templates for user communications 2. **Product features**: * Add or modify features based on your business requirements * Implement tier-specific functionality for different subscription levels * Create admin dashboards for monitoring and management 3. **User experience**: * Improve navigation and information architecture * Optimize the onboarding flow for new users * Add help documentation or contextual guidance ### Prepare for Production When you're ready to launch your application: 1. **Move to production environment**: * Switch Stripe from test mode to live mode * Update API keys with production credentials * Configure a new webhook endpoint for live Stripe events 2. **Set up a custom domain**: * Purchase and configure a domain name * Set up DNS records to point to your application * Configure SSL certificates for secure connections 3. **Implement monitoring and analytics**: * Add error tracking with a service like Sentry * Set up usage analytics to understand user behavior * Monitor performance and optimize as needed 4. **Create a marketing strategy**: * Develop content to attract users to your SaaS * Set up social media accounts and campaigns * Consider implementing referral programs ### Advanced Development 1. **Extend the application**: * Integrate additional third-party services as needed * Implement more complex business logic * Add advanced features like file uploads, real-time collaboration, etc. 2. **Optimize for scale**: * Implement caching strategies for better performance * Set up database indexes for frequently accessed data * Consider serverless functions for computation-heavy tasks 3. **Mobile optimization**: * Ensure responsive design works well on all devices * Consider developing native mobile apps if needed * Implement progressive web app features *** ## Summary You've successfully built a complete SaaS application with: * A modern frontend framework * **Supabase** for authentication and database functionality * **Stripe** for subscription billing and payment processing This integrated stack provides everything you need for a modern SaaS application: * User authentication and account management * Secure database operations with row-level security * Subscription billing and management * Webhook processing for payment events * A responsive UI with modern design patterns By using Tempo to orchestrate these services, you've saved countless hours of integration work. Instead of spending weeks connecting these services manually, you can now focus on building the unique features that make your SaaS valuable to users. ### Additional Resources * [Supabase Documentation](https://supabase.com/docs) * [Stripe API Reference](https://stripe.com/docs/api) Good luck with your SaaS project!
Was this page helpful? [Yes](#) | [No](#) # Tempo's Chat Modes Source: https://tempolabsinc.mintlify.app/chat-modes A guide to using Normal, Reasoning, and Search Modes # Introducing Tempo's Chat Modes Welcome to a new era of coding efficiency with **Tempo's Reasoning Agents**. By combining **Gemini's** powerful reasoning capabilities and **Claude 3.7**’s precise code execution, you’ll enjoy the best accuracy and speed in your development workflow. We’ve also added **Search Mode** so you can pull in external information directly into your chats.  ## Chat Modes Overview Tempo offers three distinct chat modes. Here’s how each one works: 1. **Normal Mode** * **Model**: Claude 3.7 * **Use Case**: General-purpose conversations, code generation, and quick debugging. * **Benefits**: Fast, reliable replies for day-to-day coding questions or brainstorming. 2. **Reasoning Mode** * **Model**: Gemini + Claude 3.7 for large context reasonsing * **Use Case**: Deep analysis of your codebase, planning out changes, and identifying files to modify. * **Benefits**: Leverages Gemini’s large context window for thorough understanding of your entire codebase, providing methodical and accurate guidance. 3. **Search Mode** * **Model**: Claude 3.7 + Gemini for Internet Search * **Use Case**: When you need immediate external information (e.g., API documentation, design patterns, reference solutions). * **Benefits**: Brings external resources right into your chat, so you can quickly gather information without leaving your coding environment. ## How the Workflow Operates 1. **Deep Reasoning (Gemini)** 1. **Context Analysis**: Gemini takes advantage of its largest-in-industry context window, scanning your entire codebase. 2. **Strategic Plan**: It outlines a thought process for the changes to be made and which files need changes. 2. **Code Execution (Claude 3.7)** 1. **Implement Changes**: Once Gemini’s plan is ready, Claude 3.7 precisely edits the relevant files. 2. **Validate & Verify**: Claude’s high accuracy ensures that any modifications align perfectly with your project’s structure. ## Enhanced Search Functionality * **Integrated Search**: In Search Mode, you can fetch external data (tutorials, API docs, design inspiration) without leaving the chat. * **Contextual Insights**: Results are merged with your chat context, so the AI can immediately reference them in subsequent suggestions. ## Why This Matters * **Accuracy**: Gemini’s deep understanding of your codebase drastically reduces errors. * **Efficiency**: Claude 3.7 is widely regarded as the best coding LLM, ensuring high-quality changes. * **Productivity**: Built-in search eliminates the need to switch between tools, streamlining your workflow. ## Getting Started 1. **Open the Chat Interface**: Select the mode you need from the mode selector (Normal, Reasoning, or Search). 2. **Ask Your Question or Give a Task**: * **Reasoning Mode** for big-picture planning or multiple-file changes. * **Search Mode** if you need external references first. * **Normal Mode** for straightforward Q\&A or coding help. 3. **Review & Approve**: Look over the suggestions before finalizing changes in your code. ## Example Use Case 1. **Switch to Reasoning Mode** to get Gemini’s plan for refactoring your authentication module. 2. **Review the Plan**. Gemini will outline which files to modify and why. 3. **Switch to Normal Mode** to let Claude 3.7 implement those changes. 4. **Search Mode** if you need additional references like best-practice docs or library usage examples. *** ### Frequently Asked Questions **Q: Does Search Mode cost extra?** A: Search Mode uses your available prompts. All external queries are processed alongside your chat context to ensure a seamless experience. **Q: What if I don’t see the chat Modes** A: This means you are either on a Free plan or on an old Paid plan. Only new paid plans have access to multiple chat modes. *** **Ready to experience a new level of accuracy and efficiency?** Try Tempo’s Reasoning Agents today and watch your development process become faster, smarter, and more reliable. [Learn more](https://tempo.new/?utm_source=x\&utm_campaign=reasoning)
Was this page helpful? [Yes](#) | [No](#) # Welcome to Tempo Source: https://tempolabsinc.mintlify.app/introduction Build React apps 10x faster with AI
.png)
## Setting up
The first step to world-class documentation is setting up your editing environments.
How To Open Dev Tools
How to filter network logs
Supabase Failed Import Error
Supabase Incorrect Function Name Error
Bad Request: supabaseKey required Error
- Contact you with relevant information and offers
- Analyze use of and improve the services
- Comply with law or defend our legal rights
- Security/fraud prevention
- Create aggregate/de-identified information | | **Login Information** (such as your username and password) | - Provide the Services and respond to your requests
- Comply with law or defend our legal rights
- Security/fraud prevention
- Create aggregate/de-identified information | | **Professional or Employment Information** (such as the name and address of the company you work for and your title) | - Provide the services and respond to your requests
- Contact you with relevant information and offers
- Analyze use of and improve the services
- Comply with law or defend our legal rights
- Security/fraud prevention
- Create aggregate/de-identified information | | **Device and Online Information** (such as mobile device information, IP address, and information about your interaction with the Site) | - Provide the Site and Services and respond to your requests
- Contact you with relevant information and offers
- Analyze use of and improve the services
- Comply with law or defend our legal rights
- Security/fraud prevention
- Create aggregate/de-identified information | | **Geolocation Data** | - Provide the Site and Services and respond to your requests
- Contact you with relevant information and offers
- Analyze use of and improve the services
- Comply with law or defend our legal rights
- Security/fraud prevention
- Create aggregate/de-identified information | | **Other Information** (any other information you choose to provide directly to us) | - Provide the Site and Services and respond to your requests
- Contact you with relevant information and offers
- Analyze use of and improve the services
- Comply with law or defend our legal rights
- Security/fraud prevention
- Create aggregate/de-identified information | **Do Not Sell Rights**\ Please note that the CCPA sets forth certain obligations for businesses that "sell" personal information to third parties. We do not engage in such activity as defined in the CCPA and have not engaged in such activity in the past twelve months from the Effective Date of this Policy. ### Your California Privacy Rights The CCPA allows you to make certain requests about your personal information. Specifically, the CCPA allows you to request us to: * Inform you about the categories of personal information we collect or disclose about you; the categories of sources of such information; the business or commercial purpose for collecting your personal information; and the categories of third parties with whom we share/disclose personal information. * Provide access to and/or a copy of certain personal information we hold about you. * Delete certain personal information we have about you. * Provide you with information about the financial incentives that we offer to you, if any. The CCPA further provides you with the right not to be discriminated against (as provided for in applicable law) for exercising your rights. Please note that certain information may be exempt from such requests under California law. For example, we need certain information to provide the Services to you. We also will take reasonable steps to verify your identity before responding to a request. If we are unable to verify you, we shall have the right, but not the obligation, to request additional information from you. If you would like further information regarding your legal rights under California law or would like to exercise any of them, or if you are an authorized agent making a request on a California consumer's behalf, please contact us using the contact information provided below. #### Shine the Light Disclosure The California "Shine the Light" law gives residents of California the right under certain circumstances to request information from us regarding the manner in which we share certain categories of personal information (as defined in the Shine the Light law) with third parties for their direct marketing purposes. We do not share your personal information with third parties for their own direct marketing purposes. *** ## Changes To Our Policy We reserve the right to amend this Policy at any time to reflect changes in the law, our data collection and use practices, or advances in technology. We will make the revised Policy accessible on the Services, so you should review the Policy periodically. You can know if the Policy has changed since the last time you reviewed it by checking the "Last updated" date at the top of the document. If we make a material change to the Policy, you will be provided with appropriate notice in accordance with legal requirements. By continuing to use the Services, you are confirming that you have read and understood the latest version of this Policy. *** ## Contact Information Tempo welcomes your comments and questions regarding this Policy and the collection and use of your information. If you have questions or concerns, please email us at [support@tempolabs.ai](mailto:support@tempolabs.ai). # Terms of Service Source: https://tempolabsinc.mintlify.app/tempo-terms Tempo Terms of Service **TEMPO INC.\ Terms of Service** **Last Updated: May 01, 2025** **Tempo Inc.** (**“we”**) provides cloud-based UI/UX software development tools on a software as a service and platform as a service basis (“Service”). The Service is provided on a subscription basis as further described in this Agreement and on the website under specific subscription plans (including freemium offerings) offered by us from time to time. The Service is provided through the website [https://www.tempo.new/](https://www.tempo.new/) **(**the**“Website”** ). This Agreement applies to anyone (“you”) who subscribes for or otherwise uses the Service. THESE TERMS (**“TERMS”**) CONTAIN IMPORTANT LIMITATIONS ON REPRESENTATIONS, WARRANTIES, CONDITIONS, REMEDIES AND LIABILITIES THAT ARE APPLICABLE TO YOUR ACCESS AND USE OF THE SERVICE. ACCORDINGLY, YOU SHOULD READ THESE TERMS CAREFULLY BEFORE USING THE SERVICE. EITHER BY CLICKING A BOX INDICATING YOUR ACCEPTANCE OR BY EXECUTING AN ORDER FORM THAT REFERENCES THESE TERMS, YOU AGREE TO THE TERMS HEREOF. IF YOU ARE AN AGENT OR EMPLOYEE OF AN ENTITY, YOU REPRESENT AND WARRANT THAT (I) THE INDIVIDUAL ACCEPTING THIS AGREEMENT IS AUTHORIZED TO ACCEPT THIS AGREEMENT ON SUCH ENTITY’S BEHALF AND TO BIND SUCH ENTITY, AND (II) SUCH ENTITY HAS FULL POWER, CORPORATE OR OTHERWISE, TO ENTER INTO THIS AGREEMENT AND PERFORM ITS OBLIGATIONS HEREUNDER. IF YOU DO NOT ACCEPT THESE TERMS, THEN DO NOT USE THE WEBSITE OR ANY OF ITS CONTENT OR SERVICE. If you have signed a separate order form (each, an “**Order Form**” and, together with these Terms, the “**Agreement**”) relating to your use of the Service, the terms of the Order Form shall prevail if they conflict in any way with these Terms. **1. Service.** Subject to this Agreement, you can use the Service during the term (the “**Term**”) prescribed by the Website, the Order Form or these Terms. You are responsible at your own expense for obtaining your own Internet access and any hardware and software required to use and access the Service. You shall use the Service solely for your internal business purposes, and you cannot sell our Service to anyone else. You have the necessary rights and authority to enter into and perform the obligations required of you under this Agreement. Your use of the Service will comply with all applicable laws and regulations. You will not infringe the rights of any third party (including without limitation any intellectual property rights or privacy rights) in your use of the Service. You shall not (and shall not allow any third party to): (a) permit any third party to access or use the Service except as envisioned by the Service in its normal operation or specified herein; (b) alter, modify, debug, reverse engineer, decompile, disassemble, or otherwise attempt to derive or gain access to any software (including source code) associated with the Service; (c) use any unauthorized robot, spider, scraper or other automated means to access the Service, or engage in any scraping, data-mining, harvesting, data aggregating or indexing of the Service; (d) frame or mirror any content forming part of the Service; or (e) access the Service in order to (i) build a competitive product or service, or (ii) copy any ideas, features, functions or graphics of the Service. You shall keep all passwords and API keys provided to you safe and secure, and shall be responsible for all use of the Service using passwords or API keys issued to you. We can suspend your access to the Service if we reasonably believe that you have violated this Agreement. The Website and Service are not intended for use by children and we reserve the right to terminate access to and use of the Service without notice to any User we have reason to believe is a minor. You shall: (a) reasonably cooperate with us in all matters relating to the Service; (b) respond promptly to any request by us to provide information, approvals, authorizations or decisions that are reasonably necessary for us to provide the Service in accordance with this Agreement; and (c) provide such you materials or information as we may reasonably request to provide the Service and ensure that such materials or information are complete and accurate in all material respects. **2. Ownership.** Except for the limited license to use the Software in Section 1 (Service), we retain all right, title, and interest in and to the Product (as defined below) and any intellectual property rights relating thereto, whether developed before or after the commencement of the Term. All rights to the Product and any intellectual property rights relating thereto not expressly granted to you pursuant to the foregoing is reserved by us and our licensors and third party vendors. There are no implied rights. “**Product**” means the Service, the client-side software or applications made available by us for you to install, download (whether onto a machine or in a browser), or execute as part of the Product (the “**Software**”), and the usage manuals and instructional materials for the Service or Software that are made available by us to you from time to time (the “**Documentation**”). **3. Feedback; Usage Data; Customer Content; Privacy** You may, but are not required to, give us suggestions, feedback, or comments about the Product or related offerings (“**Feedback**”), in which case you give Feedback “AS IS”. We may use all Feedback freely without any restriction or obligation. We may collect, analyze, and share with contractors and third party vendors any Usage Data or Customer Content in order to (i) provide the Service to you; or (ii) evaluate and improve or train the functions, features and operation of the Product or the products or services developed by Provider’s third party vendors from time to time. “**Customer Content**” means data, information, or materials submitted by or on behalf of you to the Product (including any of your software shared or otherwise made available by you to us for purposes of providing the Service) but excludes Feedback. “**Usage Data**” means data and information about the provision, use, and performance of the Product and related offerings based on your use of the Product. This Agreement incorporates by reference our privacy policy (our “**Privacy Policy**”) located here, all of which terms and conditions shall be deemed to be included in this Agreement. You are solely responsible for all Customer Content. You shall not upload or otherwise make available to us any Customer Content that: (a) constitutes an infringement, misappropriation, or violation of all intellectual property rights, proprietary rights, rights of publicity, rights of privacy, and any and all other legal rights protecting data, information, or intangible property throughout the world, including, without limitation, any and all copyrights, trademarks, service marks, trade secrets, patent rights, moral rights, sui generis rights in databases, and contract rights; (b) violates this Agreement, including, without limitation, the Privacy Policy or any applicable laws, rules, or regulations; (c) is unlawful, harassing, abusive, tortious, threatening, harmful, invasive of another’s privacy, vulgar, defamatory, false, intentionally misleading, trade libelous, pornographic, sexually explicit, obscene, patently offensive, promotes racism, bigotry, hatred, or physical harm of any kind against any group or individual, promotes illegal activities or contributes to the creation of weapons, illegal materials, or is otherwise objectionable or illegal in any way; (d) contains software viruses or any other computer code, files or programs designed to interrupt, destroy, limit the functionality of any computer software or hardware or telecommunications equipment; (e) interferes with or disrupts the Service or servers or networks connected to the Service; (f) is harmful to minors in any way; (g) constitutes unsolicited or unauthorized advertising, promotional materials, junk mail, spam, chain letters, pyramid schemes, or any other form of duplicative or unsolicited messages, whether commercial or otherwise; or (h) causes us to violate any applicable law, rule or regulation, including those regarding the export of technical data. **4. Fees; Payments; Taxes.** You shall pay the fees, if any, prescribed by the applicable Order Form or the Website, at such times as may be prescribed therein. We reserve the right to increase our fees or terminate or limit any freeium use rights at any time upon prior notice. Fees are exclusive of applicable taxes. Late payments may be subject to interest or other charges set forth on the Order Form or the Website. **5. Term.** Freeium use can be terminated at any time. Otherwise, you shall have the right to use the Service during the Term. We can terminate or suspend your account at any time if you breach this Agreement. Upon any termination of this Agreement: (a) all rights granted to you hereunder shall terminate and we shall no longer provide access to the Service to you, and (b) you shall cease using the Service. Any obligations that have accrued prior to termination shall survive termination of this Agreement. In addition, the following Sections, as well as any other provisions herein which by their nature should survive, shall survive termination of this Agreement: Sections 2-12. You may cancel your account and terminate this Agreement at any time by following the instructions on the Order Form applicable to you or, if you have not executed an Order Form, by following the instructions set out on the Website. **6. Disclaimers.** THE SERVICE IS PROVIDED ON AN “AS –IS” BASIS. WE MAKE NO REPRESENTATION OR WARRANTY WHATSOEVER, AND HEREBY DISCLAIM ALL REPRESENTATIONS AND WARRANTIES WITH RESPECT TO THE SERVICE (IN EACH CASE WHETHER EXPRESS OR IMPLIED BY LAW, COURSE OF DEALING, COURSE OF PERFORMANCE, USAGE OF TRADE OR OTHERWISE), INCLUDING ANY WARRANTY (A) OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, OR NON-INFRINGEMENT, (B) THAT THE SERVICE WILL MEET YOUR REQUIREMENTS, WILL ALWAYS BE AVAILABLE , ACCESSIBLE, UNINTERRUPTED), TIMELY, OR OPERATE WITHOUT ERROR, (C) AS TO THE RESULTS THAT MAY BE OBTAINED FROM THE USE OF THE SERVICE, OR (D) AS TO THE ACCURACY OR RELIABILITY OF ANY INFORMATION OBTAINED FROM THE SERVICE. YOU ACKNOWLEDGE THAT THE SERVICE IS HOSTED BY A THIRD PARTY HOSTING PROVIDER (THE “HOSTING CONTRACTOR”) AND USES THIRD PARTY SERVER HARDWARE, DISK STORAGE, FIREWALL PROTECTION, SERVER OPERATING SYSTEMS, MANAGEMENT PROGRAMS, WEB SERVER PROGRAMS FOR DELIVERY OF THE SERVICE (THE “HOSTING CONTRACTOR SERVICE”). ADDITIONALLY, WE USE THIRD PARTIES TO HELP RECEIVE PAYMENTS (“PAYMENT PROCESSOR”). WE MAY CHANGE OUR HOSTING CONTRACTOR AND PAYMENT PROCESSOR AT ANY TIME. YOUR USE OF THE SERVICE IS SUBJECT TO ANY RESTRICTIONS IMPOSED BY THE HOSTING CONTRACTOR AND THE PAYMENT PROCESSOR, AS APPLICABLE. NOTWITHSTANDING ANY OTHER PROVISION OF THIS AGREEMENT, WE SHALL NOT BE LIABLE FOR ANY PROBLEMS, FAILURES, DEFECTS OR ERRORS WITH THE SERVICE TO THE EXTENT CAUSED BY THE HOSTING CONTRACTOR OR PAYMENT PROCESSOR. YOU ACKNOWLEDGE THAT ANY FEES PAYABLE FOR THE SERVICE REFLECT THE FACT THAT WE ARE NOT RESPONSIBLE FOR THE ACTS AND OMISSIONS OF THE HOSTING CONTRACTOR OR PAYMENT PROCESSOR, AND THAT WE COULD NOT AFFORD TO PROVIDE THE SERVICE AT THE PRICES OFFERED (OR ON A FREEMIUM BASIS) IF WE WERE RESPONSIBLE FOR THE ACTS OR OMISSIONS OF THE HOSTING CONTRACTOR OR PAYMENT PROCESSOR. WE DO NOT REPRESENT OR WARRANT THAT THE SERVICE WILL PRODUCE ACCURATE OR RELEVANT CONTENT FOR YOU, OR OTHERWISE PERFORM WITHOUT INTERRUPTION OR ERROR. WHILE MAINTAINING REASONABLE DATA SECURITY MEASURES, WE CANNOT GUARANTEE THAT THE SERVICE IS SECURE FROM HACKING OR OTHER UNAUTHORIZED INTRUSION, OR THAT CUSTOMER CONTENT OR USAGE DATA WILL REMAIN PRIVATE OR SECURE UPON SUCH HACKING OR INTRUSION. WE DO NOT REPRESENT THAT THE OUTPUT GENERATED BY THE SERVICE WILL BE SATISFACTORY IN ANY WAY TO YOU. WE HAVE NO CONTROL OVER THE OPERATION OF THE THIRD PARTY LLMS THAT WE ACCESS AS PART OF OUR PROCESSING ACTIVITIES, THE OUTPUTS THEY GENERATE, OR THE CONTINUED AVAILABILITY OF ANY THIRD PARTY LLMS. **7. Limitations.** IN NO EVENT SHALL WE BE LIABLE FOR ANY INDIRECT, CONSEQUENTIAL, INCIDENTAL, SPECIAL, EXEMPLARY OR PUNITIVE DAMAGES (INCLUDING LOSS OF DATA, PROFITS OR REVENUE) ARISING OUT OF OR RELATED TO THE SERVICE OR THIS AGREEMENT, WHETHER SUCH DAMAGES ARISE IN CONTRACT, TORT (INCLUDING NEGLIGENCE) OR OTHERWISE. TO THE FULLEST EXTENT PERMISSIBLE BY LAW, OUR TOTAL LIABILITY FOR ALL DAMAGES ARISING OUT OF OR RELATED TO THE SERVICE OR THIS AGREEMENT, WHETHER IN CONTRACT, TORT (INCLUDING NEGLIGENCE) OR OTHERWISE EXCLUDING OUR BREACH OF THE CONFIDENTIALITY PROVISIONS SET FORTH HEREIN, SHALL NOT EXCEED THE TOTAL AMOUNT OF FEES PAID BY US BY YOU DURING THE THEN-CURRENT TERM WHATEVER THE MOMENT OF THE THEN-CURRENT PERIOD. THE PARTIES AGREE THAT THE LIMITATIONS OF LIABILITY SET FORTH IN THIS SECTION 8 ARE A FUNDAMENTAL BASIS OF THE BARGAIN, THAT WE HAVE SET OUR FEES IN RELIANCE ON THE ENFORCEABILITY OF THESE PROVISIONS, AND THAT THEY SHALL APPLY NOTWITHSTANDING THAT ANY REMEDY SHALL FAIL ITS ESSENTIAL PURPOSE. **9. Indemnification.** You shall defend, indemnify and hold harmless us and our directors, officers, employees, agents, contractors and vendors (“**Indemnified Parties**”) from and against any Claims based on: (i) your use of the Service in breach of this Agreement, and (ii) any claims relating in any way (whether pursuant to third party infringement claims or otherwise) to the Customer Content submitted by you or on your behalf to Service. **10. Confidentiality.** “**Confidential Information**” will include, but will not be limited to, any and all information associated with a party’s business and not publicly known, including specific business information, technical processes and formulas, software, customer lists, prospective customer lists, names, addresses and other information regarding customers and prospective customers, product designs, sales, costs (including any relevant processing fees), price lists, and other unpublished financial information, business plans and marketing data, and any other confidential and proprietary information, whether or not marked as confidential or proprietary. Our Confidential Information includes all information that you receive relating to us, or to the Services, that is not known to the general public including information related to our security program and practices. Each party agrees to use the other party’s Confidential Information solely as necessary for performing its obligations under this Agreement and in accordance with any other rights and obligations in this Agreement including this Section 10. Each party agrees that it will take all reasonable steps, at least substantially equivalent to the steps it takes to protect its own proprietary information, to prevent the duplication, disclosure or use of any such Confidential Information, other than (i) by or to its employees, agents, subcontractors and vendors who must have access to such Confidential Information to perform such party’s obligations hereunder, who each will treat such Confidential Information as provided herein, and who are each subject to obligations of confidentiality to such party that are at least as stringent as those contained herein; or (ii) as required by any law, regulation, or order of any court of proper jurisdiction over the parties and the subject matter contained in this Agreement, provided that, if legally permitted, the receiving party will give the disclosing party prompt written notice and use commercially reasonable efforts to ensure that such disclosure is accorded confidential treatment. Confidential Information will not include any information that the receiving party can prove: (A) was already in the public domain, or was already known by or in the possession of the receiving party, at the time of disclosure of such information; (B) is independently developed by the receiving party without use of or reference to the other party’s Confidential Information, and without breaching any provisions of this Agreement; or (C) is thereafter rightly obtained by the receiving party from a source other than the disclosing party without breaching any provision of this Agreement. **11. Miscellaneous.** We may amend these Terms at any time. You may not assign this Agreement to any person other than in connection with a sale of substantially all of your assets to a third party. This Agreement (including the Order Form, if applicable) contains the complete understanding and agreement of the Parties with respect to the subject matter hereof, and supersedes all prior or contemporaneous agreements or understandings, oral or written, with respect thereto. Each Party hereby rejects the inclusion of any pre-printed terms and conditions on any purchase orders or other such contract documents. We may give any notices issued in connection with this Agreement by email to you at the email address given by you when creating your account, and such notices shall be effective upon confirmation of transmission to you. Neither Party will be liable to the other Party for any failure or delay in performance by circumstances beyond its control, including, fire, labor difficulties, telecommunication failures, Internet unavailability, governmental actions or terrorism, provided that the Party seeking to rely on such circumstances gives written notice of such circumstances to the other Party and uses reasonable efforts to overcome such circumstances. Any question, claim or controversy arising out of or related to this Agreement (a “Dispute”) will be governed by and construed in accordance with the laws of the Province of Ontario, without giving effect to any conflicts of laws provision thereof or of any other jurisdiction that would produce a contrary result. In the event of any Dispute, the designated representatives of you and we shall promptly confer and exert their good faith efforts to reach a reasonable and equitable resolution of such Dispute. If such representatives are unable to resolve such Dispute within five business days, the Dispute shall be referred promptly to the responsible senior management of each Party for resolution. Neither Party shall seek any other means of resolving any Dispute until both Parties’ responsible senior management have had at least five business days to resolve the Dispute. If the Parties are unable to resolve the Dispute in accordance with the foregoing procedure, then either Party may, at any time, deliver notice to the other Party of its intent to submit the Dispute to the Court of the Province of Ontario, Canada. The relationship between the Parties is that of independent contractors. Nothing contained in this Agreement shall be construed as creating any agency, partnership, joint venture or other form of joint enterprise or employment relationship between the Parties, and neither Party shall have authority to contract for or bind the other Party in any manner whatsoever. No waiver by either Party of any of the provision of this Agreement is effective unless explicitly set forth in writing and signed by such Party. No failure to exercise, or delay in exercising, any right, remedy, power or privilege arising from this Agreement operates, or may be construed, as a waiver thereof. No single or partial exercise of any right, remedy, power or privilege hereunder precludes any other or further exercise thereof or the exercise of any other right, remedy, power or privilege. If any provision of this Agreement is held to be unenforceable or illegal by a court or tribunal of competent jurisdiction, such provision will be modified to the extent necessary to render it enforceable, or will be severed from this Agreement, and all other provisions of this Agreement will remain in full force and effect. Headings are provided for convenience only and will not be used to interpret the substance of this Agreement. Unless the intent is expressly otherwise in specific instances, use of the words “include,” “includes,” or “including” in this Agreement shall not be limiting and “or” shall not be exclusive. **12. Refunds and Cancellations** 12.1 Refund Policy\ Tempo Inc. provides digital services on a subscription basis. Refunds are limited and only considered in the event of verified technical issues that prevent access to the Service, despite proper use and good-faith efforts to resolve the issue with our support team. Refund requests must be submitted in writing within 7 days of the charge date to [**support@tempo.new**](mailto:support@tempo.new), and must include the registered account email, the date and amount charged, and a description of the issue. Refunds will not be issued for: * User dissatisfaction with features or performance; * Unused credits or partial use of services; * Failure to cancel prior to renewal; * General feature limitations or unmet expectations; * Downgrades or changes in business needs. Tempo Inc. reserves the right to deny any refund requests that fall outside this policy. 12.2 Cancellation Policy\ You may cancel your subscription at any time via your account settings. Upon cancellation, you will retain access to the Service until the end of your current billing cycle. No refunds or prorated charges will be issued for the remainder of the current period. Failed payments will result in automatic downgrade to a limited-access Free Tier after retry attempts fail. Tempo subscriptions are billed monthly and can be upgraded, downgraded, or reactivated at any time from your dashboard.