[FEATURE] Add panel-level repeat variable support by adrianSepiol · Pull Request #149 · perses/shared

adrianSepiol · 2026-06-01T17:22:16Z

Description

Adds support for repeat panel based on variable. Uses only selected values from dropdown are used.

Screenshots

In below recording you can notice that width of panel is expanded when you select repeat variable and height is used for single tile. If you don't fill 'Max per row' all tiles will be fitted into single row.

layout-editor.mov

In this one you can see how the panel will behave when the amount of selected values will change. You can enter edit mode only with first panel.

Screen.Recording.2026-06-10.at.09.00.11.mov

Group repeat has priority over panel repeat.

Screen.Recording.2026-06-01.at.19.14.58.mov

Checklist

Pull request has a descriptive title and context useful to a reviewer.
Pull request title follows the [<catalog_entry>] <commit message> naming convention using one of the
following catalog_entry values: FEATURE, ENHANCEMENT, BUGFIX, BREAKINGCHANGE, DOC,IGNORE.
All commits have DCO signoffs.

UI Changes

Changes that impact the UI include screenshots and/or screencasts of the relevant changes.
Code follows the UI guidelines.
E2E tests are stable and unlikely to be flaky.
See e2e docs for more details. Common issues include:
- Is the data inconsistent? You need to mock API requests.
- Does the time change? You need to use consistent time values or mock time utilities.
- Does it have loading states? You need to wait for loading to complete.

shahrokni · 2026-06-08T07:41:56Z

@adrianSepiol
Could you please check the two following pipelines. It seems they are failing. ci/build and ci/type-check`` And please before that, rebase` with main.

adrianSepiol · 2026-06-08T07:56:06Z

@adrianSepiol Could you please check the two following pipelines. It seems they are failing. ci/build and ci/type-check And please before that, ``rebase` with main.

@shahrokni Pipelines are failing because of PR mentioned in description that needs to be merged for this to work: perses/spec#32

adrianSepiol · 2026-06-10T07:02:56Z

Removed "mode" option after comments from @AntoineThebaud in perses/perses#2936. I've updated description of PR.

Signed-off-by: Adrian Sepiół <a.sepiol@sap.com>

adrianSepiol · 2026-07-20T13:17:56Z

Hi @jgbernalp @Gladorme, I've moved this pr to ready for review with new Layout tab that we have discussed.

jgbernalp · 2026-07-24T09:05:45Z

+  layoutDefinition?: {
+    width: number;
+    height: number;
+    repeatVariable?: {


do we have a limit on the total number of repetitions, what if a variable value produces 1K options. It seems a lot of panels would be created in that case and I see no configurable value to set a max

jgbernalp · 2026-07-24T09:31:16Z

+// limitations under the License.
+
+export * from './LayoutEditor';
+export * from './RepeatLayoutPreview';


Suggested change

export * from './RepeatLayoutPreview';

export * from './RepeatLayoutPreview';

export * from './RepeatVariableEditor';

jgbernalp · 2026-07-24T09:32:46Z

+            const currentGroup = state.panelGroups[panelGroupId];
+            const layoutIndex = currentGroup?.itemLayouts.findIndex((layout) => layout.i === panelGroupLayoutId);
+            if (currentGroup === undefined || layoutIndex === undefined || layoutIndex === -1) {
+              throw new Error(`Could not find layout for panel group item ${panelGroupItemId}`);


Suggested change

throw new Error(`Could not find layout for panel group item ${panelGroupItemId}`);

throw new Error(`Could not find layout for panel group item ${JSON.stringify(panelGroupItemId)}`);

jgbernalp · 2026-07-24T09:32:53Z

+            }
+            const currentLayout = currentGroup.itemLayouts[layoutIndex];
+            if (currentLayout === undefined) {
+              throw new Error(`Could not find layout for panel group item ${panelGroupItemId}`);


Suggested change

throw new Error(`Could not find layout for panel group item ${panelGroupItemId}`);

throw new Error(`Could not find layout for panel group item ${JSON.stringify(panelGroupItemId)}`);

jgbernalp · 2026-07-24T09:34:09Z

+import { GridItemContent } from './GridItemContent';
+import { RepeatGridItemContent } from './RepeatGridItemContent';
+
+const DEFAULT_MARGIN = 10;


Should we import this from Row.tsx?

jgbernalp · 2026-07-24T09:34:55Z

  // Provide actions to the panel when in edit mode
  let editHandlers: PanelProps['editHandlers'] = undefined;
-  if (isEditMode) {
+  if (canModify && !readonly) {


canModify already checks readonly

jgbernalp · 2026-07-24T09:36:59Z

+ * A group of non-overridden variable definitions sharing a common source/scope.
+ * `source` is undefined for dashboard-scoped variables.
+ */
+export interface VariableDefinitionGroup {


The same interface is in the plugin system package. We should use it from a single place either dashboards or plugin-system but not both.

jgbernalp · 2026-07-24T09:38:25Z

+    }
+    return result;
+  }, [variableValues, perRow]);
+  const perPanelWidth = useMemo(() => Math.floor((width - itemGap * (perRow - 1)) / perRow), [itemGap, perRow, width]);


It seems the value could be negative when the container is very narrow, relative to perRow.

adrianSepiol requested a review from a team as a code owner June 1, 2026 17:22

adrianSepiol force-pushed the feature/panel-level-repeat branch 2 times, most recently from c42f663 to b611f9c Compare June 10, 2026 06:53

adrianSepiol force-pushed the feature/panel-level-repeat branch from b611f9c to 23fe7b8 Compare June 11, 2026 10:16

adrianSepiol marked this pull request as draft July 10, 2026 07:20

adrianSepiol force-pushed the feature/panel-level-repeat branch 10 times, most recently from ddec28f to 9a6a842 Compare July 20, 2026 12:37

[FEATURE] Add panel-level repeat variable support

b83e228

Signed-off-by: Adrian Sepiół <a.sepiol@sap.com>

adrianSepiol force-pushed the feature/panel-level-repeat branch from 9a6a842 to b83e228 Compare July 20, 2026 12:49

adrianSepiol marked this pull request as ready for review July 20, 2026 12:58

jgbernalp reviewed Jul 24, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

[FEATURE] Add panel-level repeat variable support#149

[FEATURE] Add panel-level repeat variable support#149
adrianSepiol wants to merge 1 commit into
perses:mainfrom
adrianSepiol:feature/panel-level-repeat

adrianSepiol commented Jun 1, 2026 •

edited

Loading

Uh oh!

shahrokni commented Jun 8, 2026

Uh oh!

adrianSepiol commented Jun 8, 2026

Uh oh!

adrianSepiol commented Jun 10, 2026

Uh oh!

adrianSepiol commented Jul 20, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

jgbernalp Jul 24, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

	export * from './RepeatLayoutPreview';
	export * from './RepeatLayoutPreview';
	export * from './RepeatVariableEditor';

	throw new Error(`Could not find layout for panel group item ${panelGroupItemId}`);
	throw new Error(`Could not find layout for panel group item ${JSON.stringify(panelGroupItemId)}`);

Uh oh!

Conversation

adrianSepiol commented Jun 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Screenshots

Checklist

UI Changes

Uh oh!

shahrokni commented Jun 8, 2026

Uh oh!

adrianSepiol commented Jun 8, 2026

Uh oh!

adrianSepiol commented Jun 10, 2026

Uh oh!

adrianSepiol commented Jul 20, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

adrianSepiol commented Jun 1, 2026 •

edited

Loading