Skip to content

kgantchev/vitosha-tulip

Repository files navigation

Vitosha Tulip

Vitosha Tulip is a web application that visualizes tasks from ClickUp in both Kanban and List views. It allows users to select snapshots of tasks by month and year, providing a historical perspective on task management. The app is built with React, styled using Material-UI (MUI), and leverages the ClickUp API to fetch task data.

Features

  • Kanban and List Views: Toggle between Kanban and List views to display tasks.
  • Snapshot Selector: Select tasks snapshots by month and year.
  • Responsive Design: Fully responsive UI using Material-UI (MUI).
  • Automated Snapshots: Monthly snapshots of tasks using GitHub Actions.
  • Deployment: Automatically deployed to vitosha-tulip.surge.sh.

Public Website

Check out the live application: https://vitosha-tulip.surge.sh

Installation

Prerequisites

  • Node.js (v14 or higher recommended)
  • Yarn package manager
  • Git

Clone the Repository

git clone https://github.com/your-username/vitosha-tulip.git
cd vitosha-tulip

Install Dependencies

yarn install

Usage

Setting Up Environment Variables

Create a .env file in the root directory and add the following environment variables:

.env

PERSONAL_ACCESS_TOKEN=your_clickup_personal_access_token
CLICKUP_SPACE_ID=your_clickup_space_id

Running the Application Locally

Start the development server

yarn start

Open your browser and navigate to http://localhost:3000 to view the app.

Building the Application

Build the app for production

yarn build

The production-ready files are generated in the build directory.

Scripts:

  • Start the Development Server: yarn start
  • Build the Application: yarn build
  • Download snapshots from ClickUp: yarn snapshot
  • Test the Application: yarn test

This script downloads the latest snapshots from ClickUp and saves them in src/data/snapshots.

Environment Variables:

The application relies on certain environment variables for configuration. These variables should be stored securely and not committed to version control.

PERSONAL_ACCESS_TOKEN: Your ClickUp API token. CLICKUP_SPACE_ID: The ID of your ClickUp space. SURGE_TOKEN: (For deployment) Your Surge.sh authentication token.

Automated Deployment:

The project includes a GitHub Actions workflow that automates the following tasks:

  • Monthly Snapshot and Deploy
  • Schedule: Runs on the last day of each month at midnight Eastern European Time.
  • Actions:
    • Executes the yarn snapshot script to download the latest tasks from ClickUp.
    • Builds the application using yarn build.
    • Deploys the application to vitosha-tulip.surge.sh.

Setting Up GitHub Actions Secrets:

To enable automated deployment, add the following secrets to your GitHub repository:

  1. PERSONAL_ACCESS_TOKEN
  2. CLICKUP_SPACE_ID
  3. SURGE_TOKEN

Navigate to your repository settings on GitHub:

  • Go to Settings > Secrets and variables > Actions.
  • Click New repository secret for each secret and add the corresponding values.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published