pagamio-frontend-commons-lib
Version:
Pagamio library for Frontend reusable components like the form engine and table container
7 lines (6 loc) • 2.06 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { HiChartPie, HiInformationCircle, HiTable } from 'react-icons/hi';
const NoChartData = ({ onSwitchToTable }) => {
return (_jsxs("div", { className: "flex flex-col items-center justify-center h-[60vh] p-6 bg-gray-50 rounded-lg", children: [_jsxs("div", { className: "relative mb-4", children: [_jsx(HiChartPie, { className: "w-16 h-16 text-gray-300" }), _jsx("div", { className: "absolute -top-1 -right-1", children: _jsx(HiInformationCircle, { className: "w-6 h-6 text-blue-500" }) })] }), _jsx("h3", { className: "text-xl font-semibold text-gray-700 mb-2", children: "Chart Visualization Unavailable" }), _jsx("p", { className: "text-gray-600 text-center max-w-md mb-6", children: "The chart visualization is not available for this dataset. You can still view and analyze the data in table format." }), onSwitchToTable && (_jsxs("button", { onClick: onSwitchToTable, className: "flex items-center gap-2 px-4 py-2 bg-blue-500 text-white rounded-lg \n hover:bg-blue-600 transition-colors duration-200 shadow-sm", children: [_jsx(HiTable, { className: "w-5 h-5" }), _jsx("span", { children: "View Data Table" })] })), _jsx("div", { className: "mt-8 p-4 bg-blue-50 rounded-lg max-w-md", children: _jsxs("div", { className: "flex gap-2", children: [_jsx(HiInformationCircle, { className: "w-5 h-5 text-blue-500 flex-shrink-0 mt-0.5" }), _jsxs("div", { className: "text-sm text-blue-700", children: [_jsx("p", { className: "font-medium mb-1", children: "Why might chart data be unavailable?" }), _jsxs("ul", { className: "list-disc list-inside space-y-1 ml-2", children: [_jsx("li", { children: "The dataset is too large to be properly rendered for chart visualization" }), _jsx("li", { children: "The dataset structure doesn't support chart visualization" }), _jsx("li", { children: "The required data fields for charting are missing" }), _jsx("li", { children: "The data format is incompatible with chart rendering" })] })] })] }) })] }));
};
export default NoChartData;