Skip to content

ivanbaluta/aistudio-chat-visualizer

Repository files navigation

AI Studio Chat Visualizer

License: MIT Python Version PRs Welcome

While working extensively with Google AI Studio, I found it difficult to keep track of dozens of branching conversations. This tool was created to solve that problem by providing a clear and convenient way to navigate the tree of my ideas.

A visualizer for Google AI Studio chats that helps you track and organize branching conversation trees.

This tool reads your chat history from the "Google AI Studio" folder on your Google Drive, builds an interactive graph of the relationships between them, and provides powerful tools for filtering, searching, and organizing with tags.

alt text

🚀 Features

  • Interactive visualization: All chats are displayed as a graph where you can move nodes and zoom.
  • Link integrity: Automatically restores connections between parent and child branches, even if there are inconsistencies in the AI Studio data.
  • Powerful filtering:
    • Real-time search by name.
    • Filter by tags from a dropdown list.
    • Display only favorite chats.
    • Display only chats that have branches.
    • Filter by last modification date.
  • Tagging system:
    • Centralized management of all tags through a convenient modal window.
    • Assign tags to any chat from the existing list.
  • Favorites: Mark important chats with a star for quick access.
  • Full chat details: A side panel displays the title, description, creation/modification dates, and a list of tags for each chat.
  • Quick source access: A direct link from the side panel to the chat file in Google Drive for easy management.

🔒 Privacy & Security

Your data privacy is the highest priority. This application is designed with a "your data is your own" philosophy.

  • Runs entirely locally: The application runs 100% on your local machine. Your data never leaves your computer and is not sent to any third-party servers.
  • Direct Google Authentication: The login process occurs directly between your computer and Google. No intermediary servers are involved.
  • Local storage: All processed information—the chat map, your list of favorites, and your tags—is stored in simple JSON files within the project folder on your own disk.
  • Fully Open-Source: You can review the code yourself to verify that it performs no hidden actions to send your data online.

🛠️ Setup & Installation

There are two ways to run this application: using Docker (recommended) or manually with Python.

Step 1: Common Prerequisites (for both methods)

Regardless of which method you choose, you need to complete these two steps first:

1. Clone the repository:

git clone https://github.com/ivanbaluta/aistudio-chat-visualizer.git
cd aistudio-chat-visualizer

2. Configure the Google Drive API:

  1. Go to the Google Cloud Console.
  2. Create a new project (e.g., "Chat-Visualizer").
  3. Enable the "Google Drive API" for this project (use the search bar at the top).
  4. Navigate to "Credentials" -> "+ Create credentials" -> "OAuth client ID".
  5. If prompted, configure the "OAuth consent screen":
    • Give your application a name and enter your email.
    • User Type: "External".
  6. Return to creating credentials:
    • Application type: "Desktop app".
    • Give it a name and click "Create".
  7. Download the JSON file with your credentials. Rename it to credentials.json and place it in the root folder of the project.
  8. In the "OAuth consent screen -> Audience" section, either exit testing mode by clicking "Publish App", or remain in test mode and add your own email address under "Test users".

Note: On the authentication screen, Google will show a "Google hasn't verified this app" warning. This is expected. You need to click "Advanced" and then "Go to [Your App Name] (unsafe)" to proceed. The application only requests read-only access to your Google Drive files.


Method 1: Running with Docker (Recommended)

This is the easiest way to run the application without manually installing Python or dependencies.

  1. Run the application with a single command from the project's root folder:
    docker-compose up --build -d
  2. Fetch your chat data (run this on first launch and to update):
    python read_chats.py
    The very first time you run this, a browser window will open for authentication.
  3. Open the application in your browser at http://127.0.0.1:5000.

To stop the application:

docker-compose down

Method 2: Manual Installation (with Python)

Use this method if you prefer not to use Docker.

  1. Create and activate a virtual environment:

    python3 -m venv venv
    # For macOS/Linux
    source venv/bin/activate
    # For Windows
    venv\Scripts\activate
  2. Install dependencies:

    pip install -r requirements.txt
  3. Fetch your chat data (run this on first launch and to update):

    python read_chats.py
  4. Start the web server:

    python server.py
  5. Open the application in your browser at http://127.0.0.1:5000.

📖 How to Use

  • Navigation: Drag the canvas to pan. Use the mouse wheel to zoom in and out.
  • View details: Click on a chat node to open the side panel with detailed information.
  • Add to favorites: Click the star icon (☆) in the side panel.
  • Manage tags:
    • Click the "Manage Tags" button to create or delete global tags in the modal window.
    • In the side panel, select a tag from the dropdown list to assign it to the current chat.
  • Open source file: Click the "↗️ Open source file in Google Drive" button in the side panel to navigate to the file on your Drive.

📜 License

This project is distributed under the MIT License. See the LICENSE file for more details.