@flagsmith/backstage-plugin 0.1.0-pr.7.3135fb9

package/dist/components/FlagsTab/FeatureDetailsGrid.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureDetailsGrid.esm.js","sources":["../../../src/components/FlagsTab/FeatureDetailsGrid.tsx"],"sourcesContent":["import { Box, Chip, Grid, Typography } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ArchiveIcon from '@material-ui/icons/Archive';\nimport ScheduleIcon from '@material-ui/icons/Schedule';\nimport VpnKeyIcon from '@material-ui/icons/VpnKey';\nimport { FlagsmithFeature, FlagsmithFeatureVersion } from '../../api/FlagsmithClient';\nimport { flagsmithColors } from '../../theme/flagsmithTheme';\nimport { detailCardStyle } from '../../theme/sharedStyles';\nimport { getFlagType, getValueType, isDefined } from '../../utils/flagTypeHelpers';\nimport { formatDate, formatDateTime } from '../../utils/dateFormatters';\n\nconst useStyles = makeStyles(theme => ({\n  detailCard: detailCardStyle(theme),\n  badgeChip: {\n    marginRight: theme.spacing(0.5),\n    marginTop: theme.spacing(0.5),\n  },\n  archivedChip: {\n    backgroundColor: theme.palette.warning.light,\n    color: theme.palette.warning.contrastText,\n  },\n  serverKeyChip: {\n    backgroundColor: flagsmithColors.secondary,\n    color: 'white',\n  },\n  scheduledCard: {\n    padding: theme.spacing(1.5),\n    marginBottom: theme.spacing(1),\n    border: `1px solid ${theme.palette.warning.main}`,\n    borderRadius: theme.shape.borderRadius,\n    backgroundColor: `${theme.palette.warning.light}20`,\n  },\n  scheduledHeader: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(0.5),\n    color: theme.palette.warning.dark,\n  },\n  scheduleIcon: {\n    fontSize: '1.2rem',\n    color: theme.palette.warning.main,\n  },\n  tagsContainer: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    gap: 4,\n  },\n}));\n\ntype LiveVersionInfo = FlagsmithFeature['live_version'];\n\ninterface FeatureDetailsGridProps {\n  feature: FlagsmithFeature;\n  liveVersion: LiveVersionInfo;\n  segmentOverrides: number;\n  scheduledVersion?: FlagsmithFeatureVersion | null;\n}\n\n/**\n * Get display name for the feature creator\n */\nconst getCreatorDisplayName = (feature: FlagsmithFeature): string => {\n  if (!feature.created_by) return 'Unknown';\n  const { email, first_name, last_name } = feature.created_by;\n  if (email) return email;\n  const fullName = `${first_name || ''} ${last_name || ''}`.trim();\n  return fullName || 'Unknown';\n};\n\nexport const FeatureDetailsGrid = ({\n  feature,\n  liveVersion,\n  segmentOverrides,\n  scheduledVersion,\n}: FeatureDetailsGridProps) => {\n  const classes = useStyles();\n\n  const flagType = getFlagType(feature);\n  const valueType = getValueType(feature);\n\n  return (\n    <>\n      {/* Status badges row */}\n      {(feature.is_server_key_only || feature.is_archived) && (\n        <Grid item xs={12}>\n          <Box display=\"flex\" flexWrap=\"wrap\">\n            {feature.is_server_key_only && (\n              <Chip\n                icon={<VpnKeyIcon />}\n                label=\"Server-side Only\"\n                size=\"small\"\n                className={`${classes.badgeChip} ${classes.serverKeyChip}`}\n              />\n            )}\n            {feature.is_archived && (\n              <Chip\n                icon={<ArchiveIcon />}\n                label=\"Archived\"\n                size=\"small\"\n                className={`${classes.badgeChip} ${classes.archivedChip}`}\n              />\n            )}\n          </Box>\n        </Grid>\n      )}\n\n      {/* Scheduled changes card */}\n      {scheduledVersion && scheduledVersion.live_from && (\n        <Grid item xs={12} md={4}>\n          <Box className={classes.scheduledCard}>\n            <Box className={classes.scheduledHeader}>\n              <ScheduleIcon className={classes.scheduleIcon} />\n              <Typography variant=\"subtitle2\">Scheduled Change</Typography>\n            </Box>\n            <Typography variant=\"body2\">\n              Scheduled for: {formatDateTime(scheduledVersion.live_from)}\n            </Typography>\n            {scheduledVersion.published_by && (\n              <Typography variant=\"body2\" color=\"textSecondary\">\n                By: {scheduledVersion.published_by}\n              </Typography>\n            )}\n          </Box>\n        </Grid>\n      )}\n\n      {/* Version card */}\n      {liveVersion && (\n        <Grid item xs={12} md={4}>\n          <Box className={classes.detailCard}>\n            <Typography variant=\"subtitle2\" gutterBottom>\n              Version\n            </Typography>\n            <Typography variant=\"body2\">\n              Status: {liveVersion.is_live ? 'Active' : 'Inactive'}\n            </Typography>\n            {liveVersion.live_from && (\n              <Typography variant=\"body2\">\n                Live since: {formatDate(liveVersion.live_from)}\n              </Typography>\n            )}\n          </Box>\n        </Grid>\n      )}\n\n      {/* Targeting card */}\n      <Grid item xs={12} md={4}>\n        <Box className={classes.detailCard}>\n          <Typography variant=\"subtitle2\" gutterBottom>\n            Targeting\n          </Typography>\n          <Typography variant=\"body2\">\n            Segment overrides: {segmentOverrides}\n          </Typography>\n          {isDefined(feature.num_identity_overrides) && (\n            <Typography variant=\"body2\">\n              Identity overrides: {feature.num_identity_overrides}\n            </Typography>\n          )}\n        </Box>\n      </Grid>\n\n      {/* Details card */}\n      <Grid item xs={12} md={4}>\n        <Box className={classes.detailCard}>\n          <Typography variant=\"subtitle2\" gutterBottom>\n            Details\n          </Typography>\n          <Typography variant=\"body2\">ID: {feature.id}</Typography>\n          <Typography variant=\"body2\">Flag Type: {flagType}</Typography>\n          <Typography variant=\"body2\">Value Type: {valueType}</Typography>\n        </Box>\n      </Grid>\n\n      {/* Ownership card */}\n      <Grid item xs={12} md={4}>\n        <Box className={classes.detailCard}>\n          <Typography variant=\"subtitle2\" gutterBottom>\n            Ownership\n          </Typography>\n          {feature.created_by && (\n            <Typography variant=\"body2\">\n              Creator: {getCreatorDisplayName(feature)}\n            </Typography>\n          )}\n          {feature.owners && feature.owners.length > 0 ? (\n            <Typography variant=\"body2\">\n              Assigned Users: {feature.owners.map(o => o.email || o.name).join(', ')}\n            </Typography>\n          ) : (\n            <Typography variant=\"body2\" color=\"textSecondary\">\n              No assigned users\n            </Typography>\n          )}\n          {feature.group_owners && feature.group_owners.length > 0 && (\n            <Typography variant=\"body2\">\n              Groups: {feature.group_owners.map(g => g.name).join(', ')}\n            </Typography>\n          )}\n        </Box>\n      </Grid>\n\n      {/* Tags */}\n      {feature.tags && feature.tags.length > 0 && (\n        <Grid item xs={12}>\n          <Typography variant=\"subtitle2\" gutterBottom>\n            Tags\n          </Typography>\n          <Box className={classes.tagsContainer}>\n            {feature.tags.map((tag, index) => (\n              <Chip key={index} label={tag} size=\"small\" variant=\"outlined\" />\n            ))}\n          </Box>\n        </Grid>\n      )}\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/FlagsTab/SegmentOverridesSection.esm.js

@@ -0,0 +1,129 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { Box, Typography, Collapse, Chip } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import KeyboardArrowDown from '@material-ui/icons/KeyboardArrowDown';
+import KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight';
+import { FlagStatusIndicator } from '../shared/FlagStatusIndicator.esm.js';
+import '../shared/SearchInput.esm.js';
+import '../shared/FlagsmithLink.esm.js';
+import '@material-ui/icons/ChevronLeft';
+import '@material-ui/icons/ChevronRight';
+import '../shared/ChartTooltip.esm.js';
+import { flagsmithColors } from '../../theme/flagsmithTheme.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  showMoreButton: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(0.5),
+    cursor: "pointer",
+    color: theme.palette.primary.main,
+    fontSize: "0.875rem",
+    marginTop: theme.spacing(1),
+    "&:hover": {
+      textDecoration: "underline"
+    }
+  },
+  showMoreContent: {
+    marginTop: theme.spacing(1.5),
+    padding: theme.spacing(1.5),
+    backgroundColor: theme.palette.type === "dark" ? "rgba(255, 255, 255, 0.05)" : "rgba(0, 0, 0, 0.02)",
+    borderRadius: theme.shape.borderRadius,
+    border: `1px solid ${theme.palette.divider}`
+  },
+  featureStateItem: {
+    padding: theme.spacing(1),
+    marginBottom: theme.spacing(0.5),
+    backgroundColor: theme.palette.background.paper,
+    borderRadius: theme.shape.borderRadius,
+    border: `1px solid ${theme.palette.divider}`
+  },
+  segmentBadge: {
+    backgroundColor: flagsmithColors.warning,
+    color: "white",
+    fontSize: "0.7rem",
+    height: 20,
+    marginLeft: theme.spacing(1)
+  }
+}));
+const SegmentOverridesSection = ({
+  feature,
+  details,
+  liveVersion
+}) => {
+  const classes = useStyles();
+  const [showMoreOpen, setShowMoreOpen] = useState(false);
+  const segmentOverrides = details?.featureState?.filter((state) => state.feature_segment !== null) ?? [];
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      Box,
+      {
+        className: classes.showMoreButton,
+        onClick: () => setShowMoreOpen(!showMoreOpen),
+        children: [
+          showMoreOpen ? /* @__PURE__ */ jsx(KeyboardArrowDown, { fontSize: "small" }) : /* @__PURE__ */ jsx(KeyboardArrowRight, { fontSize: "small" }),
+          /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "span", children: showMoreOpen ? "Hide additional details" : "Show additional details" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(Collapse, { in: showMoreOpen, timeout: "auto", children: /* @__PURE__ */ jsxs(Box, { className: classes.showMoreContent, children: [
+      /* @__PURE__ */ jsxs(Box, { mb: 1.5, children: [
+        /* @__PURE__ */ jsxs(Typography, { variant: "body2", children: [
+          /* @__PURE__ */ jsx("strong", { children: "Published:" }),
+          " ",
+          liveVersion?.published ? "Yes" : "No",
+          liveVersion?.published_by && ` (by ${liveVersion.published_by})`
+        ] }),
+        /* @__PURE__ */ jsxs(Typography, { variant: "body2", children: [
+          /* @__PURE__ */ jsx("strong", { children: "Archived:" }),
+          " ",
+          feature.is_archived ? "Yes" : "No"
+        ] })
+      ] }),
+      details?.featureState && details.featureState.length > 0 && /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "subtitle2", gutterBottom: true, children: "Segment Overrides" }),
+        segmentOverrides.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "textSecondary", children: "No segment overrides configured." }) : segmentOverrides.map((state, index) => /* @__PURE__ */ jsxs(
+          Box,
+          {
+            className: classes.featureStateItem,
+            children: [
+              /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+                /* @__PURE__ */ jsx(FlagStatusIndicator, { enabled: state.enabled, size: "small" }),
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", style: { marginLeft: 8 }, children: state.enabled ? "Enabled" : "Disabled" }),
+                state.feature_segment && /* @__PURE__ */ jsx(
+                  Chip,
+                  {
+                    label: `Segment: ${state.feature_segment.segment} (Priority: ${state.feature_segment.priority})`,
+                    size: "small",
+                    className: classes.segmentBadge
+                  }
+                )
+              ] }),
+              state.feature_state_value && /* @__PURE__ */ jsxs(Box, { mt: 0.5, ml: 3, children: [
+                state.feature_state_value.string_value !== null && state.feature_state_value.string_value !== void 0 && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "textSecondary", children: [
+                  'Value: "',
+                  state.feature_state_value.string_value,
+                  '"'
+                ] }),
+                state.feature_state_value.integer_value !== null && state.feature_state_value.integer_value !== void 0 && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "textSecondary", children: [
+                  "Value: ",
+                  state.feature_state_value.integer_value
+                ] }),
+                state.feature_state_value.boolean_value !== null && state.feature_state_value.boolean_value !== void 0 && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "textSecondary", children: [
+                  "Value:",
+                  " ",
+                  String(state.feature_state_value.boolean_value)
+                ] })
+              ] })
+            ]
+          },
+          state.id || index
+        ))
+      ] })
+    ] }) })
+  ] });
+};
+
+export { SegmentOverridesSection };
+//# sourceMappingURL=SegmentOverridesSection.esm.js.map

package/dist/components/FlagsTab/SegmentOverridesSection.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentOverridesSection.esm.js","sources":["../../../src/components/FlagsTab/SegmentOverridesSection.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { Box, Chip, Collapse, Typography } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport KeyboardArrowDown from '@material-ui/icons/KeyboardArrowDown';\nimport KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight';\nimport {\n  FlagsmithFeature,\n  FlagsmithFeatureDetails,\n} from '../../api/FlagsmithClient';\nimport { FlagStatusIndicator } from '../shared';\nimport { flagsmithColors } from '../../theme/flagsmithTheme';\n\nconst useStyles = makeStyles(theme => ({\n  showMoreButton: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(0.5),\n    cursor: 'pointer',\n    color: theme.palette.primary.main,\n    fontSize: '0.875rem',\n    marginTop: theme.spacing(1),\n    '&:hover': {\n      textDecoration: 'underline',\n    },\n  },\n  showMoreContent: {\n    marginTop: theme.spacing(1.5),\n    padding: theme.spacing(1.5),\n    backgroundColor:\n      theme.palette.type === 'dark'\n        ? 'rgba(255, 255, 255, 0.05)'\n        : 'rgba(0, 0, 0, 0.02)',\n    borderRadius: theme.shape.borderRadius,\n    border: `1px solid ${theme.palette.divider}`,\n  },\n  featureStateItem: {\n    padding: theme.spacing(1),\n    marginBottom: theme.spacing(0.5),\n    backgroundColor: theme.palette.background.paper,\n    borderRadius: theme.shape.borderRadius,\n    border: `1px solid ${theme.palette.divider}`,\n  },\n  segmentBadge: {\n    backgroundColor: flagsmithColors.warning,\n    color: 'white',\n    fontSize: '0.7rem',\n    height: 20,\n    marginLeft: theme.spacing(1),\n  },\n}));\n\ntype LiveVersionInfo = FlagsmithFeature['live_version'];\n\ninterface SegmentOverridesSectionProps {\n  feature: FlagsmithFeature;\n  details: FlagsmithFeatureDetails | null;\n  liveVersion: LiveVersionInfo;\n}\n\nexport const SegmentOverridesSection = ({\n  feature,\n  details,\n  liveVersion,\n}: SegmentOverridesSectionProps) => {\n  const classes = useStyles();\n  const [showMoreOpen, setShowMoreOpen] = useState(false);\n\n  const segmentOverrides =\n    details?.featureState?.filter(state => state.feature_segment !== null) ??\n    [];\n\n  return (\n    <>\n      <Box\n        className={classes.showMoreButton}\n        onClick={() => setShowMoreOpen(!showMoreOpen)}\n      >\n        {showMoreOpen ? (\n          <KeyboardArrowDown fontSize=\"small\" />\n        ) : (\n          <KeyboardArrowRight fontSize=\"small\" />\n        )}\n        <Typography variant=\"body2\" component=\"span\">\n          {showMoreOpen ? 'Hide additional details' : 'Show additional details'}\n        </Typography>\n      </Box>\n\n      <Collapse in={showMoreOpen} timeout=\"auto\">\n        <Box className={classes.showMoreContent}>\n          <Box mb={1.5}>\n            <Typography variant=\"body2\">\n              <strong>Published:</strong> {liveVersion?.published ? 'Yes' : 'No'}\n              {liveVersion?.published_by && ` (by ${liveVersion.published_by})`}\n            </Typography>\n            <Typography variant=\"body2\">\n              <strong>Archived:</strong> {feature.is_archived ? 'Yes' : 'No'}\n            </Typography>\n          </Box>\n\n          {details?.featureState && details.featureState.length > 0 && (\n            <Box>\n              <Typography variant=\"subtitle2\" gutterBottom>\n                Segment Overrides\n              </Typography>\n              {segmentOverrides.length === 0 ? (\n                <Typography variant=\"body2\" color=\"textSecondary\">\n                  No segment overrides configured.\n                </Typography>\n              ) : (\n                segmentOverrides.map((state, index) => (\n                  <Box\n                    key={state.id || index}\n                    className={classes.featureStateItem}\n                  >\n                    <Box display=\"flex\" alignItems=\"center\">\n                      <FlagStatusIndicator enabled={state.enabled} size=\"small\" />\n                      <Typography variant=\"body2\" style={{ marginLeft: 8 }}>\n                        {state.enabled ? 'Enabled' : 'Disabled'}\n                      </Typography>\n                      {state.feature_segment && (\n                        <Chip\n                          label={`Segment: ${state.feature_segment.segment} (Priority: ${state.feature_segment.priority})`}\n                          size=\"small\"\n                          className={classes.segmentBadge}\n                        />\n                      )}\n                    </Box>\n                    {state.feature_state_value && (\n                      <Box mt={0.5} ml={3}>\n                        {state.feature_state_value.string_value !== null &&\n                          state.feature_state_value.string_value !==\n                            undefined && (\n                            <Typography variant=\"caption\" color=\"textSecondary\">\n                              Value: \"{state.feature_state_value.string_value}\"\n                            </Typography>\n                          )}\n                        {state.feature_state_value.integer_value !== null &&\n                          state.feature_state_value.integer_value !==\n                            undefined && (\n                            <Typography variant=\"caption\" color=\"textSecondary\">\n                              Value: {state.feature_state_value.integer_value}\n                            </Typography>\n                          )}\n                        {state.feature_state_value.boolean_value !== null &&\n                          state.feature_state_value.boolean_value !==\n                            undefined && (\n                            <Typography variant=\"caption\" color=\"textSecondary\">\n                              Value:{' '}\n                              {String(state.feature_state_value.boolean_value)}\n                            </Typography>\n                          )}\n                      </Box>\n                    )}\n                  </Box>\n                ))\n              )}\n            </Box>\n          )}\n        </Box>\n      </Collapse>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/FlagsTab/index.esm.js

@@ -0,0 +1,138 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useMemo } from 'react';
+import { Box, Grid, Typography, TableContainer, Paper, Table, TableHead, TableRow, TableCell, TableBody, TablePagination } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import { useEntity } from '@backstage/plugin-catalog-react';
+import '../shared/FlagStatusIndicator.esm.js';
+import { SearchInput } from '../shared/SearchInput.esm.js';
+import { FlagsmithLink } from '../shared/FlagsmithLink.esm.js';
+import '@material-ui/icons/ChevronLeft';
+import '@material-ui/icons/ChevronRight';
+import { LoadingState } from '../shared/LoadingState.esm.js';
+import { ErrorState } from '../shared/ErrorState.esm.js';
+import '../shared/ChartTooltip.esm.js';
+import { buildProjectUrl } from '../../theme/flagsmithTheme.esm.js';
+import { useFlagsmithProject } from '../../hooks/useFlagsmithProject.esm.js';
+import '@backstage/core-plugin-api';
+import { DEFAULT_ROWS_PER_PAGE, MAX_TABLE_ENVIRONMENTS, PAGINATION_OPTIONS } from '../../constants/index.esm.js';
+import { ExpandableRow } from './ExpandableRow.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  header: {
+    marginBottom: theme.spacing(2)
+  },
+  headerActions: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(2),
+    justifyContent: "flex-end"
+  },
+  errorHint: {
+    marginTop: theme.spacing(2)
+  }
+}));
+const FIXED_COLUMNS_COUNT = 4;
+const FlagsTab = () => {
+  const classes = useStyles();
+  const { entity } = useEntity();
+  const [searchQuery, setSearchQuery] = useState("");
+  const [page, setPage] = useState(0);
+  const [rowsPerPage, setRowsPerPage] = useState(DEFAULT_ROWS_PER_PAGE);
+  const projectId = entity.metadata.annotations?.["flagsmith.com/project-id"];
+  const { project, environments, features, loading, error, client } = useFlagsmithProject(projectId);
+  const filteredFeatures = useMemo(() => {
+    if (!searchQuery.trim()) return features;
+    const query = searchQuery.toLowerCase();
+    return features.filter(
+      (f) => f.name.toLowerCase().includes(query) || f.description?.toLowerCase().includes(query)
+    );
+  }, [features, searchQuery]);
+  const paginatedFeatures = useMemo(() => {
+    const startIndex = page * rowsPerPage;
+    return filteredFeatures.slice(startIndex, startIndex + rowsPerPage);
+  }, [filteredFeatures, page, rowsPerPage]);
+  const handleChangePage = (_event, newPage) => {
+    setPage(newPage);
+  };
+  const handleChangeRowsPerPage = (event) => {
+    setRowsPerPage(parseInt(event.target.value, 10));
+    setPage(0);
+  };
+  const dashboardUrl = buildProjectUrl(
+    projectId || "",
+    environments[0]?.id?.toString()
+  );
+  const displayedEnvs = environments.slice(0, MAX_TABLE_ENVIRONMENTS);
+  const totalColumns = FIXED_COLUMNS_COUNT + displayedEnvs.length;
+  if (loading) {
+    return /* @__PURE__ */ jsx(LoadingState, { message: "Loading feature flags..." });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx(Box, { p: 3, children: /* @__PURE__ */ jsx(
+      ErrorState,
+      {
+        message: error,
+        hint: !projectId ? "Add a flagsmith.com/project-id annotation to this entity to view feature flags." : void 0
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxs(Box, { p: 3, children: [
+    /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, alignItems: "center", className: classes.header, children: [
+      /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, md: 6, children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "h4", children: "Feature Flags" }),
+        /* @__PURE__ */ jsxs(Typography, { variant: "body2", color: "textSecondary", children: [
+          project?.name,
+          " (",
+          features.length,
+          " flags)"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, md: 6, children: /* @__PURE__ */ jsxs(Box, { className: classes.headerActions, children: [
+        /* @__PURE__ */ jsx(
+          SearchInput,
+          {
+            value: searchQuery,
+            onChange: setSearchQuery,
+            placeholder: "Search flags..."
+          }
+        ),
+        /* @__PURE__ */ jsx(FlagsmithLink, { href: dashboardUrl, iconOnly: true, tooltip: "Open Dashboard" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx(TableContainer, { component: Paper, children: /* @__PURE__ */ jsxs(Table, { size: "small", children: [
+      /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+        /* @__PURE__ */ jsx(TableCell, { padding: "checkbox" }),
+        /* @__PURE__ */ jsx(TableCell, { children: "Flag Name" }),
+        /* @__PURE__ */ jsx(TableCell, { children: "Tags" }),
+        displayedEnvs.map((env) => /* @__PURE__ */ jsx(TableCell, { align: "center", children: env.name }, env.id)),
+        /* @__PURE__ */ jsx(TableCell, { children: "Created" })
+      ] }) }),
+      /* @__PURE__ */ jsx(TableBody, { children: filteredFeatures.length === 0 ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: totalColumns, align: "center", children: /* @__PURE__ */ jsx(Typography, { color: "textSecondary", children: searchQuery ? "No flags match your search" : "No feature flags found for this project" }) }) }) : paginatedFeatures.map((feature) => /* @__PURE__ */ jsx(
+        ExpandableRow,
+        {
+          feature,
+          environments,
+          client,
+          projectId,
+          orgId: project?.organisation || 0
+        },
+        feature.id
+      )) })
+    ] }) }),
+    /* @__PURE__ */ jsx(
+      TablePagination,
+      {
+        component: "div",
+        count: filteredFeatures.length,
+        page,
+        onPageChange: handleChangePage,
+        rowsPerPage,
+        onRowsPerPageChange: handleChangeRowsPerPage,
+        rowsPerPageOptions: PAGINATION_OPTIONS
+      }
+    )
+  ] });
+};
+
+export { FlagsTab };
+//# sourceMappingURL=index.esm.js.map

package/dist/components/FlagsTab/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../src/components/FlagsTab/index.tsx"],"sourcesContent":["import { useState, useMemo } from 'react';\nimport {\n  Typography,\n  Box,\n  Grid,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  TablePagination,\n  Paper,\n} from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useEntity } from '@backstage/plugin-catalog-react';\nimport { SearchInput, FlagsmithLink, LoadingState, ErrorState } from '../shared';\nimport { buildProjectUrl } from '../../theme/flagsmithTheme';\nimport { useFlagsmithProject } from '../../hooks';\nimport {\n  MAX_TABLE_ENVIRONMENTS,\n  DEFAULT_ROWS_PER_PAGE,\n  PAGINATION_OPTIONS,\n} from '../../constants';\nimport { ExpandableRow } from './ExpandableRow';\n\nconst useStyles = makeStyles(theme => ({\n  header: {\n    marginBottom: theme.spacing(2),\n  },\n  headerActions: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(2),\n    justifyContent: 'flex-end',\n  },\n  errorHint: {\n    marginTop: theme.spacing(2),\n  },\n}));\n\n/** Number of fixed columns (checkbox, name, tags, created) */\nconst FIXED_COLUMNS_COUNT = 4;\n\nexport const FlagsTab = () => {\n  const classes = useStyles();\n  const { entity } = useEntity();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [page, setPage] = useState(0);\n  const [rowsPerPage, setRowsPerPage] = useState(DEFAULT_ROWS_PER_PAGE);\n\n  const projectId = entity.metadata.annotations?.['flagsmith.com/project-id'];\n  const { project, environments, features, loading, error, client } =\n    useFlagsmithProject(projectId);\n\n  const filteredFeatures = useMemo(() => {\n    if (!searchQuery.trim()) return features;\n    const query = searchQuery.toLowerCase();\n    return features.filter(\n      f =>\n        f.name.toLowerCase().includes(query) ||\n        f.description?.toLowerCase().includes(query),\n    );\n  }, [features, searchQuery]);\n\n  const paginatedFeatures = useMemo(() => {\n    const startIndex = page * rowsPerPage;\n    return filteredFeatures.slice(startIndex, startIndex + rowsPerPage);\n  }, [filteredFeatures, page, rowsPerPage]);\n\n  const handleChangePage = (_event: unknown, newPage: number) => {\n    setPage(newPage);\n  };\n\n  const handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setRowsPerPage(parseInt(event.target.value, 10));\n    setPage(0);\n  };\n\n  const dashboardUrl = buildProjectUrl(\n    projectId || '',\n    environments[0]?.id?.toString(),\n  );\n\n  const displayedEnvs = environments.slice(0, MAX_TABLE_ENVIRONMENTS);\n  const totalColumns = FIXED_COLUMNS_COUNT + displayedEnvs.length;\n\n  if (loading) {\n    return <LoadingState message=\"Loading feature flags...\" />;\n  }\n\n  if (error) {\n    return (\n      <Box p={3}>\n        <ErrorState\n          message={error}\n          hint={!projectId ? 'Add a flagsmith.com/project-id annotation to this entity to view feature flags.' : undefined}\n        />\n      </Box>\n    );\n  }\n\n  return (\n    <Box p={3}>\n      <Grid container spacing={2} alignItems=\"center\" className={classes.header}>\n        <Grid item xs={12} md={6}>\n          <Typography variant=\"h4\">Feature Flags</Typography>\n          <Typography variant=\"body2\" color=\"textSecondary\">\n            {project?.name} ({features.length} flags)\n          </Typography>\n        </Grid>\n        <Grid item xs={12} md={6}>\n          <Box className={classes.headerActions}>\n            <SearchInput\n              value={searchQuery}\n              onChange={setSearchQuery}\n              placeholder=\"Search flags...\"\n            />\n            <FlagsmithLink href={dashboardUrl} iconOnly tooltip=\"Open Dashboard\" />\n          </Box>\n        </Grid>\n      </Grid>\n\n      <TableContainer component={Paper}>\n        <Table size=\"small\">\n          <TableHead>\n            <TableRow>\n              <TableCell padding=\"checkbox\" />\n              <TableCell>Flag Name</TableCell>\n              <TableCell>Tags</TableCell>\n              {displayedEnvs.map(env => (\n                <TableCell key={env.id} align=\"center\">\n                  {env.name}\n                </TableCell>\n              ))}\n              <TableCell>Created</TableCell>\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {filteredFeatures.length === 0 ? (\n              <TableRow>\n                <TableCell colSpan={totalColumns} align=\"center\">\n                  <Typography color=\"textSecondary\">\n                    {searchQuery\n                      ? 'No flags match your search'\n                      : 'No feature flags found for this project'}\n                  </Typography>\n                </TableCell>\n              </TableRow>\n            ) : (\n              paginatedFeatures.map(feature => (\n                <ExpandableRow\n                  key={feature.id}\n                  feature={feature}\n                  environments={environments}\n                  client={client}\n                  projectId={projectId!}\n                  orgId={project?.organisation || 0}\n                />\n              ))\n            )}\n          </TableBody>\n        </Table>\n      </TableContainer>\n      <TablePagination\n        component=\"div\"\n        count={filteredFeatures.length}\n        page={page}\n        onPageChange={handleChangePage}\n        rowsPerPage={rowsPerPage}\n        onRowsPerPageChange={handleChangeRowsPerPage}\n        rowsPerPageOptions={PAGINATION_OPTIONS}\n      />\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/FlagsmithOverviewCard/FeatureFlagRow.esm.js

@@ -0,0 +1,41 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { TableRow, TableCell, Typography, Tooltip, Box } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import { FlagStatusIndicator } from '../shared/FlagStatusIndicator.esm.js';
+import '../shared/SearchInput.esm.js';
+import '../shared/FlagsmithLink.esm.js';
+import '@material-ui/icons/ChevronLeft';
+import '@material-ui/icons/ChevronRight';
+import '../shared/ChartTooltip.esm.js';
+import { buildEnvStatusTooltip, getFeatureEnvStatus } from '../../utils/flagHelpers.esm.js';
+
+const useStyles = makeStyles(() => ({
+  envDots: {
+    display: "flex",
+    gap: 2,
+    justifyContent: "flex-end"
+  }
+}));
+const FeatureFlagRow = ({ feature, environments }) => {
+  const classes = useStyles();
+  return /* @__PURE__ */ jsxs(TableRow, { hover: true, children: [
+    /* @__PURE__ */ jsxs(TableCell, { children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", children: feature.name }),
+      feature.description && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "textSecondary", children: [
+        feature.description.substring(0, 40),
+        feature.description.length > 40 ? "..." : ""
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(TableCell, { align: "right", children: /* @__PURE__ */ jsx(Tooltip, { title: buildEnvStatusTooltip(feature, environments), children: /* @__PURE__ */ jsx(Box, { className: classes.envDots, children: environments.map((env) => /* @__PURE__ */ jsx(
+      FlagStatusIndicator,
+      {
+        enabled: getFeatureEnvStatus(feature, env.id),
+        size: "small"
+      },
+      env.id
+    )) }) }) })
+  ] });
+};
+
+export { FeatureFlagRow };
+//# sourceMappingURL=FeatureFlagRow.esm.js.map

package/dist/components/FlagsmithOverviewCard/FeatureFlagRow.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeatureFlagRow.esm.js","sources":["../../../src/components/FlagsmithOverviewCard/FeatureFlagRow.tsx"],"sourcesContent":["import { Box, TableCell, TableRow, Tooltip, Typography } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { FlagsmithFeature, FlagsmithEnvironment } from '../../api/FlagsmithClient';\nimport { FlagStatusIndicator } from '../shared';\nimport { getFeatureEnvStatus, buildEnvStatusTooltip } from '../../utils';\n\nconst useStyles = makeStyles(() => ({\n  envDots: {\n    display: 'flex',\n    gap: 2,\n    justifyContent: 'flex-end',\n  },\n}));\n\ninterface FeatureFlagRowProps {\n  feature: FlagsmithFeature;\n  environments: FlagsmithEnvironment[];\n}\n\nexport const FeatureFlagRow = ({ feature, environments }: FeatureFlagRowProps) => {\n  const classes = useStyles();\n\n  return (\n    <TableRow hover>\n      <TableCell>\n        <Typography variant=\"body2\">{feature.name}</Typography>\n        {feature.description && (\n          <Typography variant=\"caption\" color=\"textSecondary\">\n            {feature.description.substring(0, 40)}\n            {feature.description.length > 40 ? '...' : ''}\n          </Typography>\n        )}\n      </TableCell>\n      <TableCell align=\"right\">\n        <Tooltip title={buildEnvStatusTooltip(feature, environments)}>\n          <Box className={classes.envDots}>\n            {environments.map(env => (\n              <FlagStatusIndicator\n                key={env.id}\n                enabled={getFeatureEnvStatus(feature, env.id)}\n                size=\"small\"\n              />\n            ))}\n          </Box>\n        </Tooltip>\n      </TableCell>\n    </TableRow>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAMA,MAAM,SAAA,GAAY,WAAW,OAAO;AAAA,EAClC,OAAA,EAAS;AAAA,IACP,OAAA,EAAS,MAAA;AAAA,IACT,GAAA,EAAK,CAAA;AAAA,IACL,cAAA,EAAgB;AAAA;AAEpB,CAAA,CAAE,CAAA;AAOK,MAAM,cAAA,GAAiB,CAAC,EAAE,OAAA,EAAS,cAAa,KAA2B;AAChF,EAAA,MAAM,UAAU,SAAA,EAAU;AAE1B,EAAA,uBACE,IAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAK,IAAA,EACb,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,SAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,OAAA,EAAS,QAAA,EAAA,OAAA,CAAQ,IAAA,EAAK,CAAA;AAAA,MACzC,QAAQ,WAAA,oBACP,IAAA,CAAC,cAAW,OAAA,EAAQ,SAAA,EAAU,OAAM,eAAA,EACjC,QAAA,EAAA;AAAA,QAAA,OAAA,CAAQ,WAAA,CAAY,SAAA,CAAU,CAAA,EAAG,EAAE,CAAA;AAAA,QACnC,OAAA,CAAQ,WAAA,CAAY,MAAA,GAAS,EAAA,GAAK,KAAA,GAAQ;AAAA,OAAA,EAC7C;AAAA,KAAA,EAEJ,CAAA;AAAA,wBACC,SAAA,EAAA,EAAU,KAAA,EAAM,SACf,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,OAAO,qBAAA,CAAsB,OAAA,EAAS,YAAY,CAAA,EACzD,8BAAC,GAAA,EAAA,EAAI,SAAA,EAAW,QAAQ,OAAA,EACrB,QAAA,EAAA,YAAA,CAAa,IAAI,CAAA,GAAA,qBAChB,GAAA;AAAA,MAAC,mBAAA;AAAA,MAAA;AAAA,QAEC,OAAA,EAAS,mBAAA,CAAoB,OAAA,EAAS,GAAA,CAAI,EAAE,CAAA;AAAA,QAC5C,IAAA,EAAK;AAAA,OAAA;AAAA,MAFA,GAAA,CAAI;AAAA,KAIZ,CAAA,EACH,CAAA,EACF,CAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/FlagsmithOverviewCard/FlagStatsRow.esm.js

@@ -0,0 +1,46 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Box, Typography } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import { FlagStatusIndicator } from '../shared/FlagStatusIndicator.esm.js';
+import '../shared/SearchInput.esm.js';
+import '../shared/FlagsmithLink.esm.js';
+import '@material-ui/icons/ChevronLeft';
+import '@material-ui/icons/ChevronRight';
+import '../shared/ChartTooltip.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  statsRow: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(2),
+    marginBottom: theme.spacing(1),
+    fontSize: "0.75rem"
+  },
+  statItem: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(0.5)
+  }
+}));
+const FlagStatsRow = ({ enabledCount, disabledCount }) => {
+  const classes = useStyles();
+  return /* @__PURE__ */ jsx(Box, { px: 2, pt: 1, children: /* @__PURE__ */ jsxs(Box, { className: classes.statsRow, children: [
+    /* @__PURE__ */ jsxs(Box, { className: classes.statItem, children: [
+      /* @__PURE__ */ jsx(FlagStatusIndicator, { enabled: true, size: "small" }),
+      /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+        enabledCount,
+        " Enabled"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(Box, { className: classes.statItem, children: [
+      /* @__PURE__ */ jsx(FlagStatusIndicator, { enabled: false, size: "small" }),
+      /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+        disabledCount,
+        " Disabled"
+      ] })
+    ] })
+  ] }) });
+};
+
+export { FlagStatsRow };
+//# sourceMappingURL=FlagStatsRow.esm.js.map

package/dist/components/FlagsmithOverviewCard/FlagStatsRow.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlagStatsRow.esm.js","sources":["../../../src/components/FlagsmithOverviewCard/FlagStatsRow.tsx"],"sourcesContent":["import { Box, Typography } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { FlagStatusIndicator } from '../shared';\n\nconst useStyles = makeStyles(theme => ({\n  statsRow: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(2),\n    marginBottom: theme.spacing(1),\n    fontSize: '0.75rem',\n  },\n  statItem: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(0.5),\n  },\n}));\n\ninterface FlagStatsRowProps {\n  enabledCount: number;\n  disabledCount: number;\n}\n\nexport const FlagStatsRow = ({ enabledCount, disabledCount }: FlagStatsRowProps) => {\n  const classes = useStyles();\n\n  return (\n    <Box px={2} pt={1}>\n      <Box className={classes.statsRow}>\n        <Box className={classes.statItem}>\n          <FlagStatusIndicator enabled size=\"small\" />\n          <Typography variant=\"caption\">{enabledCount} Enabled</Typography>\n        </Box>\n        <Box className={classes.statItem}>\n          <FlagStatusIndicator enabled={false} size=\"small\" />\n          <Typography variant=\"caption\">{disabledCount} Disabled</Typography>\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAIA,MAAM,SAAA,GAAY,WAAW,CAAA,KAAA,MAAU;AAAA,EACrC,QAAA,EAAU;AAAA,IACR,OAAA,EAAS,MAAA;AAAA,IACT,UAAA,EAAY,QAAA;AAAA,IACZ,GAAA,EAAK,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAA;AAAA,IACpB,YAAA,EAAc,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAA;AAAA,IAC7B,QAAA,EAAU;AAAA,GACZ;AAAA,EACA,QAAA,EAAU;AAAA,IACR,OAAA,EAAS,MAAA;AAAA,IACT,UAAA,EAAY,QAAA;AAAA,IACZ,GAAA,EAAK,KAAA,CAAM,OAAA,CAAQ,GAAG;AAAA;AAE1B,CAAA,CAAE,CAAA;AAOK,MAAM,YAAA,GAAe,CAAC,EAAE,YAAA,EAAc,eAAc,KAAyB;AAClF,EAAA,MAAM,UAAU,SAAA,EAAU;AAE1B,EAAA,uBACE,GAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAI,CAAA,EAAG,EAAA,EAAI,GACd,QAAA,kBAAA,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,QAAA,EACtB,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,QAAA,EACtB,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,mBAAA,EAAA,EAAoB,OAAA,EAAO,IAAA,EAAC,IAAA,EAAK,OAAA,EAAQ,CAAA;AAAA,sBAC1C,IAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,SAAA,EAAW,QAAA,EAAA;AAAA,QAAA,YAAA;AAAA,QAAa;AAAA,OAAA,EAAQ;AAAA,KAAA,EACtD,CAAA;AAAA,oBACA,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,QAAA,EACtB,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,mBAAA,EAAA,EAAoB,OAAA,EAAS,KAAA,EAAO,IAAA,EAAK,OAAA,EAAQ,CAAA;AAAA,sBAClD,IAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,SAAA,EAAW,QAAA,EAAA;AAAA,QAAA,aAAA;AAAA,QAAc;AAAA,OAAA,EAAS;AAAA,KAAA,EACxD;AAAA,GAAA,EACF,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/FlagsmithOverviewCard/index.esm.js

@@ -0,0 +1,90 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { TableContainer, Paper, Table, TableHead, TableRow, TableCell, Tooltip, TableBody, Typography, Box } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import { InfoCard } from '@backstage/core-components';
+import { useEntity } from '@backstage/plugin-catalog-react';
+import '../shared/FlagStatusIndicator.esm.js';
+import '../shared/SearchInput.esm.js';
+import { FlagsmithLink } from '../shared/FlagsmithLink.esm.js';
+import { MiniPagination } from '../shared/MiniPagination.esm.js';
+import { LoadingState } from '../shared/LoadingState.esm.js';
+import { ErrorState } from '../shared/ErrorState.esm.js';
+import '../shared/ChartTooltip.esm.js';
+import { buildProjectUrl } from '../../theme/flagsmithTheme.esm.js';
+import { useFlagsmithProject } from '../../hooks/useFlagsmithProject.esm.js';
+import '@backstage/core-plugin-api';
+import { paginate, calculateFeatureStats } from '../../utils/flagHelpers.esm.js';
+import { FlagStatsRow } from './FlagStatsRow.esm.js';
+import { FeatureFlagRow } from './FeatureFlagRow.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  headerActions: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(1)
+  }
+}));
+const PAGE_SIZE = 5;
+const FlagsmithOverviewCard = () => {
+  const classes = useStyles();
+  const { entity } = useEntity();
+  const [page, setPage] = useState(0);
+  const projectId = entity.metadata.annotations?.["flagsmith.com/project-id"];
+  const { project, environments, features, loading, error } = useFlagsmithProject(projectId);
+  if (loading) {
+    return /* @__PURE__ */ jsx(InfoCard, { title: "Flagsmith Flags", children: /* @__PURE__ */ jsx(LoadingState, { message: "Loading flags...", size: 24 }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx(InfoCard, { title: "Flagsmith Flags", children: /* @__PURE__ */ jsx(ErrorState, { message: error }) });
+  }
+  const { paginatedItems: paginatedFeatures, totalPages } = paginate(
+    features,
+    page,
+    PAGE_SIZE
+  );
+  const { enabledCount, disabledCount } = calculateFeatureStats(features);
+  const dashboardUrl = buildProjectUrl(
+    projectId || "",
+    environments[0]?.id?.toString()
+  );
+  return /* @__PURE__ */ jsxs(
+    InfoCard,
+    {
+      title: "Flagsmith Flags",
+      subheader: project?.name,
+      action: /* @__PURE__ */ jsx(Box, { className: classes.headerActions, children: /* @__PURE__ */ jsx(FlagsmithLink, { href: dashboardUrl, iconOnly: true, tooltip: "Open Dashboard" }) }),
+      children: [
+        /* @__PURE__ */ jsx(FlagStatsRow, { enabledCount, disabledCount }),
+        /* @__PURE__ */ jsx(TableContainer, { component: Paper, variant: "outlined", children: /* @__PURE__ */ jsxs(Table, { size: "small", children: [
+          /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+            /* @__PURE__ */ jsx(TableCell, { children: "Flag Name" }),
+            /* @__PURE__ */ jsx(TableCell, { align: "right", children: /* @__PURE__ */ jsx(Tooltip, { title: environments.map((e) => e.name).join(" \u2022 "), children: /* @__PURE__ */ jsx("span", { children: "Environments" }) }) })
+          ] }) }),
+          /* @__PURE__ */ jsx(TableBody, { children: paginatedFeatures.length === 0 ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: 2, align: "center", children: /* @__PURE__ */ jsx(Typography, { color: "textSecondary", variant: "body2", children: "No feature flags found" }) }) }) : paginatedFeatures.map((feature) => /* @__PURE__ */ jsx(
+            FeatureFlagRow,
+            {
+              feature,
+              environments
+            },
+            feature.id
+          )) })
+        ] }) }),
+        /* @__PURE__ */ jsx(
+          MiniPagination,
+          {
+            page,
+            totalPages,
+            totalItems: features.length,
+            onPrevious: () => setPage((p) => Math.max(0, p - 1)),
+            onNext: () => setPage((p) => Math.min(totalPages - 1, p + 1)),
+            itemLabel: "flags"
+          }
+        )
+      ]
+    }
+  );
+};
+
+export { FlagsmithOverviewCard };
+//# sourceMappingURL=index.esm.js.map

package/dist/components/FlagsmithOverviewCard/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../../src/components/FlagsmithOverviewCard/index.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Typography,\n  Box,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Paper,\n  Tooltip,\n} from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { InfoCard } from '@backstage/core-components';\nimport { useEntity } from '@backstage/plugin-catalog-react';\nimport { FlagsmithLink, MiniPagination, LoadingState, ErrorState } from '../shared';\nimport { buildProjectUrl } from '../../theme/flagsmithTheme';\nimport { useFlagsmithProject } from '../../hooks';\nimport { calculateFeatureStats, paginate } from '../../utils';\nimport { FlagStatsRow } from './FlagStatsRow';\nimport { FeatureFlagRow } from './FeatureFlagRow';\n\nconst useStyles = makeStyles(theme => ({\n  headerActions: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(1),\n  },\n}));\n\nconst PAGE_SIZE = 5;\n\nexport const FlagsmithOverviewCard = () => {\n  const classes = useStyles();\n  const { entity } = useEntity();\n  const [page, setPage] = useState(0);\n\n  const projectId = entity.metadata.annotations?.['flagsmith.com/project-id'];\n  const { project, environments, features, loading, error } = useFlagsmithProject(projectId);\n\n  if (loading) {\n    return (\n      <InfoCard title=\"Flagsmith Flags\">\n        <LoadingState message=\"Loading flags...\" size={24} />\n      </InfoCard>\n    );\n  }\n\n  if (error) {\n    return (\n      <InfoCard title=\"Flagsmith Flags\">\n        <ErrorState message={error} />\n      </InfoCard>\n    );\n  }\n\n  const { paginatedItems: paginatedFeatures, totalPages } = paginate(\n    features,\n    page,\n    PAGE_SIZE,\n  );\n  const { enabledCount, disabledCount } = calculateFeatureStats(features);\n  const dashboardUrl = buildProjectUrl(\n    projectId || '',\n    environments[0]?.id?.toString(),\n  );\n\n  return (\n    <InfoCard\n      title=\"Flagsmith Flags\"\n      subheader={project?.name}\n      action={\n        <Box className={classes.headerActions}>\n          <FlagsmithLink href={dashboardUrl} iconOnly tooltip=\"Open Dashboard\" />\n        </Box>\n      }\n    >\n      <FlagStatsRow enabledCount={enabledCount} disabledCount={disabledCount} />\n\n      <TableContainer component={Paper} variant=\"outlined\">\n        <Table size=\"small\">\n          <TableHead>\n            <TableRow>\n              <TableCell>Flag Name</TableCell>\n              <TableCell align=\"right\">\n                <Tooltip title={environments.map(e => e.name).join(' • ')}>\n                  <span>Environments</span>\n                </Tooltip>\n              </TableCell>\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {paginatedFeatures.length === 0 ? (\n              <TableRow>\n                <TableCell colSpan={2} align=\"center\">\n                  <Typography color=\"textSecondary\" variant=\"body2\">\n                    No feature flags found\n                  </Typography>\n                </TableCell>\n              </TableRow>\n            ) : (\n              paginatedFeatures.map(feature => (\n                <FeatureFlagRow\n                  key={feature.id}\n                  feature={feature}\n                  environments={environments}\n                />\n              ))\n            )}\n          </TableBody>\n        </Table>\n      </TableContainer>\n\n      <MiniPagination\n        page={page}\n        totalPages={totalPages}\n        totalItems={features.length}\n        onPrevious={() => setPage(p => Math.max(0, p - 1))}\n        onNext={() => setPage(p => Math.min(totalPages - 1, p + 1))}\n        itemLabel=\"flags\"\n      />\n    </InfoCard>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAuBA,MAAM,SAAA,GAAY,WAAW,CAAA,KAAA,MAAU;AAAA,EACrC,aAAA,EAAe;AAAA,IACb,OAAA,EAAS,MAAA;AAAA,IACT,UAAA,EAAY,QAAA;AAAA,IACZ,GAAA,EAAK,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA;AAExB,CAAA,CAAE,CAAA;AAEF,MAAM,SAAA,GAAY,CAAA;AAEX,MAAM,wBAAwB,MAAM;AACzC,EAAA,MAAM,UAAU,SAAA,EAAU;AAC1B,EAAA,MAAM,EAAE,MAAA,EAAO,GAAI,SAAA,EAAU;AAC7B,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAElC,EAAA,MAAM,SAAA,GAAY,MAAA,CAAO,QAAA,CAAS,WAAA,GAAc,0BAA0B,CAAA;AAC1E,EAAA,MAAM,EAAE,SAAS,YAAA,EAAc,QAAA,EAAU,SAAS,KAAA,EAAM,GAAI,oBAAoB,SAAS,CAAA;AAEzF,EAAA,IAAI,OAAA,EAAS;AACX,IAAA,uBACE,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,iBAAA,EACd,QAAA,kBAAA,GAAA,CAAC,gBAAa,OAAA,EAAQ,kBAAA,EAAmB,IAAA,EAAM,EAAA,EAAI,CAAA,EACrD,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,KAAA,EAAO;AACT,IAAA,uBACE,GAAA,CAAC,YAAS,KAAA,EAAM,iBAAA,EACd,8BAAC,UAAA,EAAA,EAAW,OAAA,EAAS,OAAO,CAAA,EAC9B,CAAA;AAAA,EAEJ;AAEA,EAAA,MAAM,EAAE,cAAA,EAAgB,iBAAA,EAAmB,UAAA,EAAW,GAAI,QAAA;AAAA,IACxD,QAAA;AAAA,IACA,IAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,YAAA,EAAc,aAAA,EAAc,GAAI,sBAAsB,QAAQ,CAAA;AACtE,EAAA,MAAM,YAAA,GAAe,eAAA;AAAA,IACnB,SAAA,IAAa,EAAA;AAAA,IACb,YAAA,CAAa,CAAC,CAAA,EAAG,EAAA,EAAI,QAAA;AAAS,GAChC;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,iBAAA;AAAA,MACN,WAAW,OAAA,EAAS,IAAA;AAAA,MACpB,MAAA,kBACE,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,QAAQ,aAAA,EACtB,QAAA,kBAAA,GAAA,CAAC,aAAA,EAAA,EAAc,IAAA,EAAM,YAAA,EAAc,QAAA,EAAQ,IAAA,EAAC,OAAA,EAAQ,kBAAiB,CAAA,EACvE,CAAA;AAAA,MAGF,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,cAA4B,aAAA,EAA8B,CAAA;AAAA,wBAExE,GAAA,CAAC,kBAAe,SAAA,EAAW,KAAA,EAAO,SAAQ,UAAA,EACxC,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAM,IAAA,EAAK,OAAA,EACV,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAA,EAAA,EACC,+BAAC,QAAA,EAAA,EACC,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,aAAU,QAAA,EAAA,WAAA,EAAS,CAAA;AAAA,4BACpB,GAAA,CAAC,aAAU,KAAA,EAAM,OAAA,EACf,8BAAC,OAAA,EAAA,EAAQ,KAAA,EAAO,aAAa,GAAA,CAAI,CAAA,CAAA,KAAK,EAAE,IAAI,CAAA,CAAE,KAAK,UAAK,CAAA,EACtD,8BAAC,MAAA,EAAA,EAAK,QAAA,EAAA,cAAA,EAAY,GACpB,CAAA,EACF;AAAA,WAAA,EACF,CAAA,EACF,CAAA;AAAA,0BACA,GAAA,CAAC,SAAA,EAAA,EACE,QAAA,EAAA,iBAAA,CAAkB,MAAA,KAAW,CAAA,uBAC3B,QAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,OAAA,EAAS,CAAA,EAAG,KAAA,EAAM,UAC3B,QAAA,kBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAM,eAAA,EAAgB,OAAA,EAAQ,OAAA,EAAQ,QAAA,EAAA,wBAAA,EAElD,CAAA,EACF,CAAA,EACF,CAAA,GAEA,iBAAA,CAAkB,GAAA,CAAI,CAAA,OAAA,qBACpB,GAAA;AAAA,YAAC,cAAA;AAAA,YAAA;AAAA,cAEC,OAAA;AAAA,cACA;AAAA,aAAA;AAAA,YAFK,OAAA,CAAQ;AAAA,WAIhB,CAAA,EAEL;AAAA,SAAA,EACF,CAAA,EACF,CAAA;AAAA,wBAEA,GAAA;AAAA,UAAC,cAAA;AAAA,UAAA;AAAA,YACC,IAAA;AAAA,YACA,UAAA;AAAA,YACA,YAAY,QAAA,CAAS,MAAA;AAAA,YACrB,UAAA,EAAY,MAAM,OAAA,CAAQ,CAAA,CAAA,KAAK,KAAK,GAAA,CAAI,CAAA,EAAG,CAAA,GAAI,CAAC,CAAC,CAAA;AAAA,YACjD,MAAA,EAAQ,MAAM,OAAA,CAAQ,CAAA,CAAA,KAAK,IAAA,CAAK,IAAI,UAAA,GAAa,CAAA,EAAG,CAAA,GAAI,CAAC,CAAC,CAAA;AAAA,YAC1D,SAAA,EAAU;AAAA;AAAA;AACZ;AAAA;AAAA,GACF;AAEJ;;;;"}