Web-Frontend/client/src/constants/widgetRegistry.jsx

// config/widgetRegistry.js

// We assume a 12-column grid.
// w: 12 = full screen width
// w: 6 = half screen width
// w: 4 = one-third screen width
// w: 3 = one-quarter screen width

export const WIDGET_REGISTRY = {
    "vaa_activity": {
        name: "VAA 7 Day Activity",
        category: "Aviation",
        description: "Displays 7-day flight level timelines across multiple volcanoes.",
        allowedSizes: {
            large: { w: 12, h: 8 }, // Spans the entire width of the screen
        }
    },

    "db_cache_health": {
        name: "DB Cache Health",
        category: "Computer Science",
        description: "Bar chart showing cache table operational status.",
        allowedSizes: {
            medium: { w: 4, h: 6 }, // 1/3 width
            large:  { w: 6, h: 6 }  // 1/2 width
        }
    },

    "ivans_alerts": {
        name: "IVANS",
        category: "Communications",
        description: "Feed of recent IVANS reports and reviewer statuses.",
        allowedSizes: {
            small:  { w: 3, h: 6 }, // 1/4 width (tall and skinny)
            medium: { w: 4, h: 8 }  // 1/3 width
        }
    },

    "remote_sensing": {
        name: "Remote Sensing",
        category: "Remote Sensing",
        description: "Feed of recent remote sensing reports.",
        allowedSizes: {
            medium: { w: 4, h: 5 }, // 1/3 width
        }
    },

    "alert_levels": {
        name: "Alert Level Changes",
        category: "Daily Alerts",
        description: "List of 7-day alert level changes with trend arrows.",
        allowedSizes: {
            small: { w: 3, h: 5 },
            medium: { w: 4, h: 5 }
        }
    }
};