[EPIC](aurora): develop Modular Architecture for Aurora Dashboard

[andypf]

Description

This epic outlines the strategy for building a flexible, modular architecture for the Aurora Dashboard (code name: carbon). The goal is to create a “modulith” that supports core functionality, core modules, and third-party extensions, ensuring high modularity while maintaining stability and performance.

Architecture Components

• Core: Handles critical functions, including extension loading.
• Modules: Core components, interchangeable for flexibility.
• Extensions: Third-party add-ons that are fully isolated, wrapped in error boundaries, and integrated via static builds, Micro Frontends (MFEs), or iframes.

Action Plan

1. Proof of Concept (POC): Build the Core App and a sample module.
2. Define Interfaces: Establish clear interfaces for core modules and extensions to ensure seamless integration.
3. Extension Loading: Implement a mechanism for loading extensions with isolation, error handling, and multiple integration options.

Key Decisions

• Rename the existing app to Greenhouse Legacy.
• Use TypeScript for development, with Vite and Vitest for build and test systems.
• Focus on maximizing Developer Experience (DX) with speed and flexibility.

Architecture Overview

+-----------------------------------------------------------------+
|                      Greenhouse Dashboard                       |
|                                                                 |
|  +------------------------+    +-----------------------------+  |
|  |      Core System       |    |       Core Modules          |  |
|  |                        |    |                             |  |
|  | - Extension Loader     |    | - Module A                  |  |
|  | - Core Functionality   |    | - Module B (Interchangeable)|  |
|  | - Dashboard Utilities  |    | - Module C                  |  |
|  +------------------------+    +-----------------------------+  |
|                                                                 |
|                      +---------------------------+              |
|                      |     Extensions            |              |
|                      | (External/Third-Party)    |              |
|                      |                           |              |
|                      | - Extension X (Isolated)  |              |
|                      | - Extension Y (MFE/Iframe)|              |
|                      | - Error Boundary          |              |
|                      +---------------------------+              |
+-----------------------------------------------------------------+

• Architecture for requirements related to OpenStack backend
• Implement an initial set of MFE for the OpenStack dashboard
  • Keystone: Project CRUD UI
  • Designate: CRUD UI

Tasks

• [Task](aurora): 1. create a proposal for Architecture Design cobaltcore-dev/aurora-dashboard#1
• [Task](aurora): 2. Setup typescript, eslint, vite and vitest cobaltcore-dev/aurora-dashboard#2
• [Task](aurora): 3. Core System Boilerplate cobaltcore-dev/aurora-dashboard#7
• [Task](aurora): 4. Implement Extension Loader  cobaltcore-dev/aurora-dashboard#6
• [Task](aurora): 5. Error Boundary Setup cobaltcore-dev/aurora-dashboard#3
• [Task](aurora): 6. Define Core Module Interfaces cobaltcore-dev/aurora-dashboard#5
• [Task](aurora): 7. Build Sample Core Modules cobaltcore-dev/aurora-dashboard#4