From 1d763df932100fc32698d176ab86cbd953548204 Mon Sep 17 00:00:00 2001 From: Matheus Macabu Date: Thu, 20 Nov 2025 09:50:07 +0100 Subject: [PATCH 01/15] Docs: Document font_min_text_size setting in reporting section (#114155) * Docs: Document font_min_text_size setting in reporting section * better wording --- .../configure-grafana/enterprise-configuration/index.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/sources/setup-grafana/configure-grafana/enterprise-configuration/index.md b/docs/sources/setup-grafana/configure-grafana/enterprise-configuration/index.md index 601a258764f..7f1cf5e3cb5 100644 --- a/docs/sources/setup-grafana/configure-grafana/enterprise-configuration/index.md +++ b/docs/sources/setup-grafana/configure-grafana/enterprise-configuration/index.md @@ -190,6 +190,10 @@ Name of the TrueType font file with bold style. Name of the TrueType font file with italic style. Default is `DejaVuSansCondensed-Oblique.ttf`. +### font_min_text_size + +The minimum pixel size that Grafana uses when rendering fonts. Default is `4`. + ### max_retries_per_panel Maximum number of times the following reporting rendering requests are retried before returning an error: generating PDFs, generating embedded dashboard images for report emails, and generating attached CSV files. To disable the retry feature, enter `0`. This is available in public preview and requires the `reportingRetries` feature toggle. Default is `3`. From cc6e0370930c8c5b4183f50b70713953e4c20033 Mon Sep 17 00:00:00 2001 From: Steve Simpson Date: Thu, 20 Nov 2025 10:00:27 +0100 Subject: [PATCH 02/15] Alerting: Add message to alert_rule_version table (Part 1). (#114194) This adds a `message` column to the `alert_rule_version` table. This follows the pattern established for dashboards as closely as possible. A new type is introduced internally for passing the new `message` field around in a type-safe manner, but doing the same for the API types becomes very messy. In that case, a new field is added with omitempty. Note this PR is only: - The column addition - The "read" path; API for listing versions Subsequent PRs will add code to actually set the message when updating rules. --- pkg/services/ngalert/api/api_ruler.go | 14 +++++- pkg/services/ngalert/api/api_ruler_test.go | 45 ++++++++++++++++--- pkg/services/ngalert/api/persist.go | 2 +- .../api/tooling/definitions/cortex-ruler.go | 3 ++ pkg/services/ngalert/models/alert_rule.go | 7 +++ pkg/services/ngalert/store/alert_rule.go | 9 ++-- pkg/services/ngalert/store/alert_rule_test.go | 4 +- pkg/services/ngalert/store/compat.go | 13 ++++++ pkg/services/ngalert/store/models.go | 3 +- pkg/services/ngalert/tests/fakes/rules.go | 23 ++++++++-- .../sqlstore/migrations/ualert/tables.go | 3 ++ 11 files changed, 105 insertions(+), 21 deletions(-) diff --git a/pkg/services/ngalert/api/api_ruler.go b/pkg/services/ngalert/api/api_ruler.go index 8e368ac1e8e..268ed7b8c5d 100644 --- a/pkg/services/ngalert/api/api_ruler.go +++ b/pkg/services/ngalert/api/api_ruler.go @@ -385,14 +385,24 @@ func (srv RulerSrv) RouteGetRuleVersionsByUID(c *contextmodel.ReqContext, ruleUI } sort.Slice(rules, func(i, j int) bool { return rules[i].ID > rules[j].ID }) result := make(apimodels.GettableRuleVersions, 0, len(rules)) - userUIDmapping := srv.getUserUIDmapping(ctx, rules) + userUIDmapping := srv.getUserUIDmapping(ctx, alertRuleVersionsToAlertRules(rules)) for _, rule := range rules { // do not provide provenance status because we do not have historical changes for it - result = append(result, toGettableExtendedRuleNode(*rule, map[string]ngmodels.Provenance{}, userUIDmapping)) + ruleNode := toGettableExtendedRuleNode(rule.AlertRule, map[string]ngmodels.Provenance{}, userUIDmapping) + ruleNode.GrafanaManagedAlert.Message = rule.Message + result = append(result, ruleNode) } return response.JSON(http.StatusOK, result) } +func alertRuleVersionsToAlertRules(vs []*ngmodels.AlertRuleVersion) []*ngmodels.AlertRule { + result := make([]*ngmodels.AlertRule, len(vs)) + for i := range vs { + result[i] = &vs[i].AlertRule + } + return result +} + func (srv RulerSrv) RoutePostNameRulesConfig(c *contextmodel.ReqContext, ruleGroupConfig apimodels.PostableRuleGroupConfig, namespaceUID string) response.Response { var deletePermanently bool if c.QueryBool("deletePermanently") { diff --git a/pkg/services/ngalert/api/api_ruler_test.go b/pkg/services/ngalert/api/api_ruler_test.go index cb6a93b27b5..c6ddeee2a6c 100644 --- a/pkg/services/ngalert/api/api_ruler_test.go +++ b/pkg/services/ngalert/api/api_ruler_test.go @@ -560,11 +560,17 @@ func TestRouteGetRuleVersionsByUID(t *testing.T) { ruleStore.Folders[orgID] = append(ruleStore.Folders[orgID], f) rule := gen.GenerateRef() - history := gen.With(gen.WithUID(rule.UID)).GenerateManyRef(3) + historyRules := gen.With(gen.WithUID(rule.UID)).GenerateManyRef(3) + history := make([]*models.AlertRuleVersion, len(historyRules)) // simulate order of the history rule.ID = 100 - for i, alertRule := range history { + for i, alertRule := range historyRules { alertRule.ID = rule.ID - int64(i) - 1 + + history[i] = &models.AlertRuleVersion{ + AlertRule: *alertRule, + Message: fmt.Sprintf("revision %d", i), + } } ruleStore.PutRule(context.Background(), rule) @@ -584,11 +590,22 @@ func TestRouteGetRuleVersionsByUID(t *testing.T) { require.Len(t, result, len(history)+1) // history + current version t.Run("should be in correct order", func(t *testing.T) { - expectedHistory := append([]*models.AlertRule{rule}, history...) + expectedHistory := append([]*models.AlertRuleVersion{{AlertRule: *rule}}, history...) for i, rul := range expectedHistory { assert.Equal(t, rul.UID, result[i].GrafanaManagedAlert.UID) } }) + + t.Run("should have correct messages", func(t *testing.T) { + expectedMessages := make([]string, 0, len(history)+1) + expectedMessages = append(expectedMessages, "") + for i := range history { + expectedMessages = append(expectedMessages, history[i].Message) + } + for i := range expectedMessages { + assert.Equal(t, expectedMessages[i], result[i].GrafanaManagedAlert.Message) + } + }) }) t.Run("NotFound when rule does not exist", func(t *testing.T) { @@ -599,10 +616,17 @@ func TestRouteGetRuleVersionsByUID(t *testing.T) { UID: "test", } guid := uuid.NewString() - history := gen.With(gen.WithGUID(guid), gen.WithKey(ruleKey)).GenerateManyRef(3) + historyRules := gen.With(gen.WithGUID(guid), gen.WithKey(ruleKey)).GenerateManyRef(3) + history := make([]*models.AlertRuleVersion, len(historyRules)) + for i, alertRule := range historyRules { + history[i] = &models.AlertRuleVersion{ + AlertRule: *alertRule, + Message: fmt.Sprintf("revision %d", i), + } + } ruleStore.History[guid] = append(ruleStore.History[guid], history...) // even if history is full of records - perms := createPermissionsForRules(history, orgID) + perms := createPermissionsForRules(historyRules, orgID) req := createRequestContextWithPerms(orgID, perms, nil) response := createService(ruleStore, nil).RouteGetRuleVersionsByUID(req, ruleKey.UID) @@ -643,10 +667,17 @@ func TestRouteGetRuleVersionsByUID(t *testing.T) { guid := uuid.NewString() rule := gen.With(gen.WithGUID(guid), gen.WithKey(ruleKey), gen.WithNamespaceUID(anotherFolder.UID)).GenerateRef() ruleStore.PutRule(context.Background(), rule) - history := gen.With(gen.WithGUID(guid), gen.WithKey(ruleKey)).GenerateManyRef(3) + historyRules := gen.With(gen.WithGUID(guid), gen.WithKey(ruleKey)).GenerateManyRef(3) + history := make([]*models.AlertRuleVersion, len(historyRules)) + for i, alertRule := range historyRules { + history[i] = &models.AlertRuleVersion{ + AlertRule: *alertRule, + Message: fmt.Sprintf("revision %d", i), + } + } ruleStore.History[guid] = history - perms := createPermissionsForRules(history, orgID) // grant permissions to all records in history but not the rule itself + perms := createPermissionsForRules(historyRules, orgID) // grant permissions to all records in history but not the rule itself req := createRequestContextWithPerms(orgID, perms, nil) response := createService(ruleStore, nil).RouteGetRuleVersionsByUID(req, ruleKey.UID) diff --git a/pkg/services/ngalert/api/persist.go b/pkg/services/ngalert/api/persist.go index 52c4ca59a14..9e7df81f48e 100644 --- a/pkg/services/ngalert/api/persist.go +++ b/pkg/services/ngalert/api/persist.go @@ -35,6 +35,6 @@ type RuleStore interface { // IncreaseVersionForAllRulesInNamespaces Increases version for all rules that have specified namespace uids IncreaseVersionForAllRulesInNamespaces(ctx context.Context, orgID int64, namespaceUIDs []string) ([]ngmodels.AlertRuleKeyWithVersion, error) - GetAlertRuleVersions(ctx context.Context, orgID int64, guid string) ([]*ngmodels.AlertRule, error) + GetAlertRuleVersions(ctx context.Context, orgID int64, guid string) ([]*ngmodels.AlertRuleVersion, error) accesscontrol.RuleUIDToNamespaceStore } diff --git a/pkg/services/ngalert/api/tooling/definitions/cortex-ruler.go b/pkg/services/ngalert/api/tooling/definitions/cortex-ruler.go index 21e6b438ac2..15cdb16d185 100644 --- a/pkg/services/ngalert/api/tooling/definitions/cortex-ruler.go +++ b/pkg/services/ngalert/api/tooling/definitions/cortex-ruler.go @@ -617,6 +617,9 @@ type GettableGrafanaRule struct { Metadata *AlertRuleMetadata `json:"metadata,omitempty" yaml:"metadata,omitempty"` GUID string `json:"guid" yaml:"guid"` MissingSeriesEvalsToResolve *int64 `json:"missing_series_evals_to_resolve,omitempty" yaml:"missing_series_evals_to_resolve,omitempty"` + + // Field is only populated when listing alert rule versions. + Message string `yaml:"message,omitempty" json:"message,omitempty"` } // UserInfo represents user-related information, including a unique identifier and a name. diff --git a/pkg/services/ngalert/models/alert_rule.go b/pkg/services/ngalert/models/alert_rule.go index 9f899bc2af7..a4e1e8fcc04 100644 --- a/pkg/services/ngalert/models/alert_rule.go +++ b/pkg/services/ngalert/models/alert_rule.go @@ -369,6 +369,13 @@ type AlertRule struct { MissingSeriesEvalsToResolve *int64 } +type AlertRuleVersion struct { + AlertRule + + // Message is only stored in the alert_rule_version table. + Message string +} + type AlertRuleMetadata struct { EditorSettings EditorSettings `json:"editor_settings"` PrometheusStyleRule *PrometheusStyleRule `json:"prometheus_style_rule,omitempty"` diff --git a/pkg/services/ngalert/store/alert_rule.go b/pkg/services/ngalert/store/alert_rule.go index 9044bb369c5..b05ba01a562 100644 --- a/pkg/services/ngalert/store/alert_rule.go +++ b/pkg/services/ngalert/store/alert_rule.go @@ -192,8 +192,8 @@ func (st DBstore) GetAlertRuleByUID(ctx context.Context, query *ngmodels.GetAler return result, err } -func (st DBstore) GetAlertRuleVersions(ctx context.Context, orgID int64, guid string) ([]*ngmodels.AlertRule, error) { - alertRules := make([]*ngmodels.AlertRule, 0) +func (st DBstore) GetAlertRuleVersions(ctx context.Context, orgID int64, guid string) ([]*ngmodels.AlertRuleVersion, error) { + alertRules := make([]*ngmodels.AlertRuleVersion, 0) err := st.SQLStore.WithDbSession(ctx, func(sess *db.Session) error { rows, err := sess.Table(new(alertRuleVersion)).Where("rule_org_id = ? AND rule_guid = ?", orgID, guid).Asc("id").Rows(new(alertRuleVersion)) if err != nil { @@ -213,7 +213,7 @@ func (st DBstore) GetAlertRuleVersions(ctx context.Context, orgID int64, guid st if previousVersion != nil && previousVersion.EqualSpec(*rule) { continue } - converted, err := alertRuleToModelsAlertRule(alertRuleVersionToAlertRule(*rule), st.Logger) + converted, err := alertRuleVersionToModelsAlertRuleVersion(*rule, st.Logger) if err != nil { st.Logger.Error("Invalid rule found in DB store, cannot convert, ignoring it", "func", "GetAlertRuleVersions", "error", err, "version_id", rule.ID) continue @@ -226,7 +226,7 @@ func (st DBstore) GetAlertRuleVersions(ctx context.Context, orgID int64, guid st if err != nil { return nil, err } - slices.SortFunc(alertRules, func(a, b *ngmodels.AlertRule) int { + slices.SortFunc(alertRules, func(a, b *ngmodels.AlertRuleVersion) int { if a.ID > b.ID { return -1 } @@ -257,6 +257,7 @@ func (st DBstore) ListDeletedRules(ctx context.Context, orgID int64) ([]*ngmodel st.Logger.Error("Invalid rule version found in DB store, ignoring it", "func", "GetAlertRuleVersions", "error", err) continue } + // Note: Message is not returned as a message cannot be set when deleting rules. converted, err := alertRuleToModelsAlertRule(alertRuleVersionToAlertRule(*rule), st.Logger) if err != nil { st.Logger.Error("Invalid rule found in DB store, cannot convert, ignoring it", "func", "GetAlertRuleVersions", "error", err, "version_id", rule.ID) diff --git a/pkg/services/ngalert/store/alert_rule_test.go b/pkg/services/ngalert/store/alert_rule_test.go index 0c49528f8d6..9a491120c8c 100644 --- a/pkg/services/ngalert/store/alert_rule_test.go +++ b/pkg/services/ngalert/store/alert_rule_test.go @@ -1682,7 +1682,7 @@ func TestIntegrationGetRuleVersions(t *testing.T) { require.NoError(t, err) assert.Len(t, versions, 2) assert.IsDecreasing(t, versions[0].ID, versions[1].ID) - diff := versions[1].Diff(versions[0], AlertRuleFieldsToIgnoreInDiff[:]...) + diff := versions[1].Diff(&versions[0].AlertRule, AlertRuleFieldsToIgnoreInDiff[:]...) assert.ElementsMatch(t, []string{"Title", "RuleGroupIndex"}, diff.Paths()) }) @@ -1712,7 +1712,7 @@ func TestIntegrationGetRuleVersions(t *testing.T) { versions, err := store.GetAlertRuleVersions(context.Background(), ruleV3.OrgID, ruleV3.GUID) require.NoError(t, err) assert.Len(t, versions, 3) - diff := versions[0].Diff(versions[1], AlertRuleFieldsToIgnoreInDiff[:]...) + diff := versions[0].Diff(&versions[1].AlertRule, AlertRuleFieldsToIgnoreInDiff[:]...) assert.ElementsMatch(t, []string{"RuleGroup", "NamespaceUID"}, diff.Paths()) }) } diff --git a/pkg/services/ngalert/store/compat.go b/pkg/services/ngalert/store/compat.go index 709450d5ed8..4f4194facc1 100644 --- a/pkg/services/ngalert/store/compat.go +++ b/pkg/services/ngalert/store/compat.go @@ -210,6 +210,7 @@ func alertRuleToAlertRuleVersion(rule alertRule) alertRuleVersion { Version: rule.Version, Created: rule.Updated, // assuming the Updated time as the creation time CreatedBy: rule.UpdatedBy, + Message: "", // Message is set by caller when creating versions Title: rule.Title, Condition: rule.Condition, Data: rule.Data, @@ -261,3 +262,15 @@ func alertRuleVersionToAlertRule(version alertRuleVersion) alertRule { MissingSeriesEvalsToResolve: version.MissingSeriesEvalsToResolve, } } + +func alertRuleVersionToModelsAlertRuleVersion(version alertRuleVersion, l log.Logger) (models.AlertRuleVersion, error) { + result, err := alertRuleToModelsAlertRule(alertRuleVersionToAlertRule(version), l) + if err != nil { + return models.AlertRuleVersion{}, err + } + + return models.AlertRuleVersion{ + AlertRule: result, + Message: version.Message, + }, nil +} diff --git a/pkg/services/ngalert/store/models.go b/pkg/services/ngalert/store/models.go index 254ec8cb048..24167a225dd 100644 --- a/pkg/services/ngalert/store/models.go +++ b/pkg/services/ngalert/store/models.go @@ -69,10 +69,11 @@ type alertRuleVersion struct { NotificationSettings string `xorm:"notification_settings"` Metadata string `xorm:"metadata"` MissingSeriesEvalsToResolve *int64 `xorm:"missing_series_evals_to_resolve"` + Message string } // EqualSpec compares two alertRuleVersion objects for equality based on their specifications and returns true if they match. -// The comparison is very basic and can produce false-negative. Fields excluded: ID, ParentVersion, RestoredFrom, Version, Created, RuleGroupIndex and CreatedBy +// The comparison is very basic and can produce false-negative. Fields excluded: ID, ParentVersion, RestoredFrom, Version, Created, RuleGroupIndex, CreatedBy and Message func (a alertRuleVersion) EqualSpec(b alertRuleVersion) bool { return a.RuleOrgID == b.RuleOrgID && a.RuleGUID == b.RuleGUID && diff --git a/pkg/services/ngalert/tests/fakes/rules.go b/pkg/services/ngalert/tests/fakes/rules.go index a0dd60e32e5..09abeaffba3 100644 --- a/pkg/services/ngalert/tests/fakes/rules.go +++ b/pkg/services/ngalert/tests/fakes/rules.go @@ -23,7 +23,7 @@ type RuleStore struct { mtx sync.Mutex // OrgID -> RuleGroup -> Namespace -> Rules Rules map[int64][]*models.AlertRule - History map[string][]*models.AlertRule + History map[string][]*models.AlertRuleVersion Deleted map[int64][]*models.AlertRule Hook func(cmd any) error // use Hook if you need to intercept some query and return an error RecordedOps []any @@ -43,7 +43,7 @@ func NewRuleStore(t *testing.T) *RuleStore { return nil }, Folders: map[int64][]*folder.Folder{}, - History: map[string][]*models.AlertRule{}, + History: map[string][]*models.AlertRuleVersion{}, } } @@ -55,7 +55,10 @@ mainloop: for _, r := range rules { rgs := f.Rules[r.OrgID] cp := models.CopyRule(r) - f.History[r.GUID] = append(f.History[r.GUID], cp) + f.History[r.GUID] = append(f.History[r.GUID], &models.AlertRuleVersion{ + AlertRule: *cp, + Message: "", + }) for idx, rulePtr := range rgs { if rulePtr.UID == r.UID { rgs[idx] = r @@ -87,6 +90,18 @@ mainloop: } } +// AppendHistory appends to rules to the version history with the given change message. +func (f *RuleStore) AppendHistory(guid string, rules []*models.AlertRule, message string) { + versions := make([]*models.AlertRuleVersion, len(rules)) + for i := range rules { + versions[i] = &models.AlertRuleVersion{ + AlertRule: *rules[i], + Message: message, + } + } + f.History[guid] = append(f.History[guid], versions...) +} + // GetRecordedCommands filters recorded commands using predicate function. Returns the subset of the recorded commands that meet the predicate func (f *RuleStore) GetRecordedCommands(predicate func(cmd any) (any, bool)) []any { f.mtx.Lock() @@ -563,7 +578,7 @@ func (f *RuleStore) GetNamespacesByRuleUID(ctx context.Context, orgID int64, uid return namespacesMap, nil } -func (f *RuleStore) GetAlertRuleVersions(_ context.Context, orgID int64, guid string) ([]*models.AlertRule, error) { +func (f *RuleStore) GetAlertRuleVersions(_ context.Context, orgID int64, guid string) ([]*models.AlertRuleVersion, error) { f.mtx.Lock() defer f.mtx.Unlock() diff --git a/pkg/services/sqlstore/migrations/ualert/tables.go b/pkg/services/sqlstore/migrations/ualert/tables.go index d6d98ebfec9..706b8dcf026 100644 --- a/pkg/services/sqlstore/migrations/ualert/tables.go +++ b/pkg/services/sqlstore/migrations/ualert/tables.go @@ -24,6 +24,9 @@ func AddTablesMigrations(mg *migrator.Migrator) { mg.AddMigration("add last_applied column to alert_configuration_history", migrator.NewAddColumnMigration(migrator.Table{Name: "alert_configuration_history"}, &migrator.Column{ Name: "last_applied", Type: migrator.DB_Int, Nullable: false, Default: "0", })) + mg.AddMigration("add message column to alert_rule_version", migrator.NewAddColumnMigration(migrator.Table{Name: "alert_rule_version"}, &migrator.Column{ + Name: "message", Type: migrator.DB_Text, Nullable: true, + })) // End of migration log, add new migrations above this line. } From fbe29596f10102dfa4137384823116c46271ffa1 Mon Sep 17 00:00:00 2001 From: petergreen86 <37148775+petergreen86@users.noreply.github.com> Date: Thu, 20 Nov 2025 09:20:02 +0000 Subject: [PATCH 03/15] Docs: Team Sync correction (#114043) --- .../configure-access/configure-authentication/github/index.md | 2 +- .../configure-access/configure-authentication/gitlab/index.md | 2 +- .../configure-access/configure-authentication/google/index.md | 2 +- .../configure-access/configure-authentication/keycloak/index.md | 2 +- .../configure-access/configure-authentication/okta/index.md | 2 +- .../setup-grafana/configure-access/configure-team-sync.md | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/sources/setup-grafana/configure-access/configure-authentication/github/index.md b/docs/sources/setup-grafana/configure-access/configure-authentication/github/index.md index 7675d739951..5924e033f90 100644 --- a/docs/sources/setup-grafana/configure-access/configure-authentication/github/index.md +++ b/docs/sources/setup-grafana/configure-access/configure-authentication/github/index.md @@ -213,7 +213,7 @@ role_attribute_path = [login=='octocat'][0] && 'GrafanaAdmin' || 'Viewer' ## Configure team synchronization {{< admonition type="note" >}} -Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and to customers on select Grafana Cloud plans. For pricing information, visit [pricing](https://grafana.com/pricing/) or contact our sales team. +Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud](https://grafana.com/products/cloud/) {{< /admonition >}} By using Team Sync, you can map teams from your GitHub organization to teams within Grafana. This will automatically assign users to the appropriate teams. diff --git a/docs/sources/setup-grafana/configure-access/configure-authentication/gitlab/index.md b/docs/sources/setup-grafana/configure-access/configure-authentication/gitlab/index.md index 913df8f4792..d3769a72ad8 100644 --- a/docs/sources/setup-grafana/configure-access/configure-authentication/gitlab/index.md +++ b/docs/sources/setup-grafana/configure-access/configure-authentication/gitlab/index.md @@ -238,7 +238,7 @@ use_refresh_token = true ## Configure team synchronization {{< admonition type="note" >}} -Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and to customers on select Grafana Cloud plans. For pricing information, visit [pricing](https://grafana.com/pricing/) or contact our sales team. +Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud](https://grafana.com/products/cloud/) {{< /admonition >}} By using Team Sync, you can map GitLab groups to teams within Grafana. This will automatically assign users to the appropriate teams. diff --git a/docs/sources/setup-grafana/configure-access/configure-authentication/google/index.md b/docs/sources/setup-grafana/configure-access/configure-authentication/google/index.md index df0cc342d38..d122bb7e0f7 100644 --- a/docs/sources/setup-grafana/configure-access/configure-authentication/google/index.md +++ b/docs/sources/setup-grafana/configure-access/configure-authentication/google/index.md @@ -162,7 +162,7 @@ auto_login = true ### Configure team synchronization {{< admonition type="note" >}} -Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and to customers on select Grafana Cloud plans. For pricing information, visit [pricing](https://grafana.com/pricing/) or contact our sales team. +Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud](https://grafana.com/products/cloud/). {{< /admonition >}} With team sync, you can easily add users to teams by utilizing their Google groups. To set up team sync for Google OAuth, refer to the following example. diff --git a/docs/sources/setup-grafana/configure-access/configure-authentication/keycloak/index.md b/docs/sources/setup-grafana/configure-access/configure-authentication/keycloak/index.md index 6a9f6488994..6ce0f7a47b2 100644 --- a/docs/sources/setup-grafana/configure-access/configure-authentication/keycloak/index.md +++ b/docs/sources/setup-grafana/configure-access/configure-authentication/keycloak/index.md @@ -111,7 +111,7 @@ viewer ## Team sync {{< admonition type="note" >}} -Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and to customers on select Grafana Cloud plans. For pricing information, visit [pricing](https://grafana.com/pricing/) or contact our sales team. +Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud](https://grafana.com/products/cloud/). {{< /admonition >}} [Team Sync](https://grafana.com/docs/grafana//setup-grafana/configure-access/configure-team-sync/) is a feature that allows you to map groups from your identity provider to Grafana teams. This is useful if you want to give your users access to specific dashboards or folders based on their group membership. diff --git a/docs/sources/setup-grafana/configure-access/configure-authentication/okta/index.md b/docs/sources/setup-grafana/configure-access/configure-authentication/okta/index.md index 6cb2d7d13c8..7bce3cb59da 100644 --- a/docs/sources/setup-grafana/configure-access/configure-authentication/okta/index.md +++ b/docs/sources/setup-grafana/configure-access/configure-authentication/okta/index.md @@ -238,7 +238,7 @@ org_mapping = ["Group 1:org_foo:Viewer", "Group 2:org_bar:Editor", "*:3:Editor"] ### Configure team synchronization {{< admonition type="note" >}} -Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and to customers on select Grafana Cloud plans. For pricing information, visit [pricing](https://grafana.com/pricing/) or contact our sales team. +Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud](https://grafana.com/products/cloud/). {{< /admonition >}} By using Team Sync, you can link your Okta groups to teams within Grafana. This will automatically assign users to the appropriate teams. diff --git a/docs/sources/setup-grafana/configure-access/configure-team-sync.md b/docs/sources/setup-grafana/configure-access/configure-team-sync.md index 1741fd33edc..a4fe4b28c48 100644 --- a/docs/sources/setup-grafana/configure-access/configure-team-sync.md +++ b/docs/sources/setup-grafana/configure-access/configure-team-sync.md @@ -18,7 +18,7 @@ weight: 600 Team sync lets you set up synchronization between your auth providers teams and teams in Grafana. This enables LDAP, OAuth, or SAML users who are members of certain teams or groups to automatically be added or removed as members of certain teams in Grafana. {{< admonition type="note" >}} -Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud Advanced](https://grafana.com/docs/grafana-cloud/). +Available in [Grafana Enterprise](https://grafana.com/docs/grafana//introduction/grafana-enterprise/) and [Grafana Cloud](https://grafana.com/docs/grafana-cloud/). {{< /admonition >}} Grafana keeps track of all synchronized users in teams, and you can see which users have been synchronized in the team members list, see `LDAP` label in screenshot. From bf509de89f71a0141ae1c13fc85a805245761c3b Mon Sep 17 00:00:00 2001 From: Anna Urbiztondo Date: Thu, 20 Nov 2025 10:24:47 +0100 Subject: [PATCH 04/15] Docs: IaC edits (#114086) * Removed Grizzly from table * Fixes * Review * Reviews * Edits * More edits * Prettier * Remove agent * Review, removing Agent docs * Prettier * Fixes * Prettier * Edit * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Update docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> * Feedback * Prettier * Variable style edits --------- Co-authored-by: Clayton Cornell <131809008+clayton-cornell@users.noreply.github.com> --- .../as-code/infrastructure-as-code/_index.md | 43 +- .../infrastructure-as-code/ansible/_index.md | 42 +- .../ansible/ansible-cloud-stack/index.md | 354 +++++++------- .../ansible-grafana-agent-linux/index.md | 156 ------- .../ansible/ansible-multiple-agents/index.md | 207 --------- .../manage-dashboards-argocd.md | 435 +++++++++--------- ...operator-dashboards-folders-datasources.md | 136 +++--- .../observability-as-code/schema-v2/_index.md | 2 +- 8 files changed, 531 insertions(+), 844 deletions(-) delete mode 100644 docs/sources/as-code/infrastructure-as-code/ansible/ansible-grafana-agent-linux/index.md delete mode 100644 docs/sources/as-code/infrastructure-as-code/ansible/ansible-multiple-agents/index.md diff --git a/docs/sources/as-code/infrastructure-as-code/_index.md b/docs/sources/as-code/infrastructure-as-code/_index.md index 1579602467b..c976df81106 100644 --- a/docs/sources/as-code/infrastructure-as-code/_index.md +++ b/docs/sources/as-code/infrastructure-as-code/_index.md @@ -4,17 +4,23 @@ keywords: - Quickstart - Grafana Cloud menuTitle: Infrastructure as code -title: Provision Grafana Cloud with infrastructure as code +title: Provision Grafana Cloud with Infrastructure as code weight: 800 +labels: + products: + - cloud canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/ --- -# Provision Grafana Cloud with infrastructure as code +# Provision Grafana Cloud with Infrastructure as code -With Grafana Cloud, you can create dashboards via configuration files in source code. This enables you to review code, reuse it, and create better workflows. +With Grafana Cloud, you can use as-code tools to create and manage resources via code, and incorporate them efficiently into your own use cases. This enables you to review code, reuse it, and create better workflows. -Via code, you can _declaratively_ manage _what_ Grafana resources to use. -The as-code tools and tutorials that follow show you what do to, to declaratively manage Grafana resources, and incorporate them efficiently into your own use cases. +{{< admonition type="note" >}} + +Most of the tools defined here can be used with one another. + +{{< /admonition >}} ## Grafana Terraform provider @@ -67,7 +73,7 @@ To get started, see the [quickstart guides for the Grafana Ansible Collection](/ ### Who is this recommended for? -Like Terraform, the Grafana Ansible collection is best suited for people already using Ansible for non-Grafana use cases. The collection only works for Grafana Cloud right now, so it makes the most sense for Grafana Cloud customers who want to manage resources declaratively using Ansible. +Like Terraform, the Grafana Ansible collection is best suited for people already using Ansible for non-Grafana use cases. The collection only works for Grafana Cloud right now, so it makes the most sense for Grafana Cloud customers who want to manage resources using Ansible. ### Known limitations @@ -75,7 +81,7 @@ The Grafana Ansible collection only works for Grafana Cloud and only supports ei ## Grafana Operator -The Grafana Operator is a Kubernetes operator that can provision, manage, and operate Grafana instances and their associated resources within Kubernetes through Custom Resources. This Kubernetes-native tool eases the administration of Grafana, offering a declarative approach to managing dashboards, data sources, and folders. It also automatically syncs the Kubernetes Custom resources and the actual resources in the Grafana Instance. It supports leveraging Grafonnet for generating Grafana dashboard definitions for seamless dashboard configuration as code. +The Grafana Operator is a Kubernetes operator that can provision, manage, and operate Grafana instances and their associated resources within Kubernetes through Custom Resources. This Kubernetes-native tool eases the administration of Grafana, including managing dashboards, data sources, and folders. It also automatically syncs the Kubernetes Custom resources and the actual resources in the Grafana Instance. It supports leveraging Grafonnet for generating Grafana dashboard definitions for seamless dashboard configuration as code. To get started, see the [quickstart guides for the Grafana Operator](/docs/grafana-cloud/as-code/infrastructure-as-code/grafana-operator/) or check out the [Grafana Operator's documentation](https://grafana.github.io/grafana-operator/). @@ -120,7 +126,7 @@ To get started with the Grafana Crossplane provider, install Crossplane in the K kubectl crossplane install provider grafana/crossplane-provider-grafana:v0.1.0 ``` -During installation of the provider, CRDs for all the resources supported by the Terraform provider are added to the cluster so users can begin defining their Grafana resources as Kubernetes custom resources. The Crossplane provider ensures that whatever is defined in the custom resource definitions is what is visible in Grafana UI. If any changes are made directly in the UI, the changes will be discarded when the provider resyncs. This helps ensure that whatever is defined declaratively in the cluster will be the source of truth for Grafana resources. +During installation of the provider, CRDs for all the resources supported by the Terraform provider are added to the cluster so users can begin defining their Grafana resources as Kubernetes custom resources. The Crossplane provider ensures that whatever is defined in the custom resource definitions is what is visible in Grafana UI. If any changes are made directly in the UI, the changes will be discarded when the provider resyncs. This helps ensure that whatever is defined via code in the cluster will be the source of truth for Grafana resources. To get started, refer to the examples folder in the Grafana Crossplane repository. @@ -152,16 +158,15 @@ To use the Crossplane provider, you must have the Crossplane CLI and Crossplane ## Grafana as code comparison -Most of the tools defined here can be used with one another. The following chart compares the properties and tools mentioned above. -| Property/Tool | Grafana Terraform Provider | Grafana Ansible Collection | Grafana Operator | Grizzly | Grafana Crossplane Provider | -| -------------------------------------- | --------------------------- | ----------------------------------------------------------------------------- | ---------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- | -| Grafana resources supported | All major Grafana resources | Grafana Cloud stack, plugins, API keys, dashboards, data sources, and folders | Dashboards, Datasources, Folders | Synthetic Monitoring checks, dashboards, data sources, folders, and Prometheus rules | All major Grafana resources | -| Tool format | HCL/JSON | YAML | YAML | Jsonnet/YAML/JSON | YAML/JSON | -| Follows Kubernetes-style manifests | | | ✓ | ✓ | ✓ | -| Easy dashboard building process | | | ✓ | ✓ | | -| Manage resources using Kubernetes | | | ✓ | | ✓ | -| Retrieves Grafana resource information | ✓ | | | | | -| Built-in resource sync process | | | ✓ | ✓ | ✓ | -| Recommended for | Existing Terraform users | Existing Ansible users | Users looking to manage Grafana resources from within Kubernetes | Users looking to define Grafana resources in a Kubernetes-style YAML and users looking to get built-in workflow support and sync process | Users looking to manage Grafana resources from within Kubernetes | +| Property/Tool | Grafana Terraform Provider | Grafana Ansible Collection | Grafana Operator | Grafana Crossplane Provider | +| -------------------------------------- | --------------------------- | ----------------------------------------------------------------------------- | ---------------------------------------------------------------- | ---------------------------------------------------------------- | +| Grafana resources supported | All major Grafana resources | Grafana Cloud stack, plugins, API keys, dashboards, data sources, and folders | Dashboards, data sources, Folders | All major Grafana resources | +| Tool format | HCL/JSON | YAML | YAML | YAML/JSON | +| Follows Kubernetes-style manifests | | | ✓ | ✓ | +| Easy dashboard building process | | | ✓ | | +| Manage resources using Kubernetes | | | ✓ | ✓ | +| Retrieves Grafana resource information | ✓ | | | | +| Built-in resource sync process | | | ✓ | ✓ | +| Recommended for | Existing Terraform users | Existing Ansible users | Users looking to manage Grafana resources from within Kubernetes | Users looking to manage Grafana resources from within Kubernetes | diff --git a/docs/sources/as-code/infrastructure-as-code/ansible/_index.md b/docs/sources/as-code/infrastructure-as-code/ansible/_index.md index 46d44ff1f90..2f977b0166e 100644 --- a/docs/sources/as-code/infrastructure-as-code/ansible/_index.md +++ b/docs/sources/as-code/infrastructure-as-code/ansible/_index.md @@ -8,22 +8,42 @@ menuTitle: Ansible title: Grafana Ansible collection weight: 110 canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/ansible/ +aliases: + - ../../infrastructure-as-code/ansible/ansible-grafana-agent-linux + - ../../infrastructure-as-code/ansible/ansible-multiple-agents +labels: + products: + - cloud --- # Grafana Ansible collection -The [Grafana Ansible collection](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/) provides configuration management resources for Grafana. You can use it to manage resources such as dashboards, Cloud stacks, folders, and more. +The [Grafana Ansible collection](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/) provides configuration management resources for Grafana. You can use it to manage: -The collection also houses the [Grafana Agent role](https://github.com/grafana/grafana-ansible-collection/tree/main/roles/grafana_agent) which can be used to deploy and manage Grafana Agent across various Linux machines. +- Grafana Cloud stacks +- Dashboards +- Data sources +- Folders +- Alerting contact points +- Notification policies +- API keys + +If your resources aren't currently available in the Grafana Ansible collection, you can manage them on Grafana Cloud programmatically by writing Ansible playbooks that use the [Ansible's built-in URI module](https://docs.ansible.com/ansible/latest/collections/ansible/builtin/uri_module.html) to call the [HTTP APIs](/docs/grafana/latest/developers/http_api/) to manage resources for the Grafana Cloud portal, as well as those within a stack. + +## Learn more + +Refer to [Create and manage a Grafana Cloud stack using Ansible](ansible-cloud-stack/) to learn how to create a Grafana Cloud stack and add a data source and dashboard using [Ansible](https://www.ansible.com/). + +To learn more about managing Grafana with Infrastructure as code: + +- [Grafana Ansible collection documentation](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/) +- [Ansible playbook best practices](https://docs.ansible.com/ansible/latest/user_guide/playbooks_best_practices.html) +- [Grafana API documentation](/docs/grafana/latest/developers/http_api/) +- [Grafana Cloud API documentation](https://grafana.com/docs/grafana-cloud/developer-resources/api-reference/) +- [Infrastructure as Code with Terraform](/docs/grafana/latest/as-code/infrastructure-as-code/terraform/) + +## Grafana Agent (deprecated) {{< docs/shared lookup="agent-deprecation.md" source="alloy" version="next" >}} -For resources currently not available in the Grafana Ansible collection, you can manage those resources on Grafana Cloud programmatically by writing Ansible playbooks that use the [Ansible's builtin uri module](https://docs.ansible.com/ansible/latest/collections/ansible/builtin/uri_module.html) to call the [HTTP APIs](/docs/grafana/latest/developers/http_api/) to manage resources for the Grafana Cloud portal, as well as those within a stack. - -Use the following guides to get started using Ansible to manage your Grafana Cloud stack: - -| Topic | Description | -| ----------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- | -| [Create and manage a Grafana Cloud stack using Ansible](ansible-cloud-stack/) | Describes how to create a Grafana Cloud stack and add a data source and dashboard using [Ansible](https://www.ansible.com/). | -| [Install Grafana Agent on a Linux host using Ansible](ansible-grafana-agent-linux/) | Describes how to install the Grafana Agent on a Linux node using Ansible and use it to push logs to Grafana Cloud. | -| [Monitor multiple Linux hosts with Grafana Agent Role](ansible-multiple-agents/) | Describes how to use the Grafana Ansible collection to manage agents across multiple Linux hosts. | +The Ansible collection also houses [Grafana Agent role](https://github.com/grafana/grafana-ansible-collection/tree/main/roles/grafana_agent), which is now deprecated. diff --git a/docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md b/docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md index 5dcab277f04..55f875fd1a7 100644 --- a/docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md +++ b/docs/sources/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/index.md @@ -4,64 +4,78 @@ keywords: - Quickstart - Grafana Cloud - Ansible -title: Create and manage a Grafana Cloud stack using Ansible +title: Create and manage your Grafana Cloud stack using Ansible +menuTitle: Manage stack using Ansible weight: 100 canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/ansible/ansible-cloud-stack/ --- -# Create and manage a Grafana Cloud stack using Ansible +# Create and manage your Grafana Cloud stack using Ansible -Learn how to add a data source, a dashboard, and a folder to a Grafana Cloud stack using Ansible collection for Grafana. +This guide shows you how to create a Grafana Cloud stack and add a data source, dashboard, and folder using the Ansible Collection for Grafana. You'll manage your Grafana infrastructure through Ansible playbooks. ## Before you begin -Before you begin, you should have the following available: +Before you begin, make sure you have the following available: -- A Grafana Cloud account. +- A Grafana Cloud account - [Ansible](https://docs.ansible.com/ansible/latest/installation_guide/index.html) installed on your machine +## Install the Grafana Ansible collection + +Install the Grafana Ansible collection: + +```sh +ansible-galaxy collection install grafana.grafana +``` + +This collection provides all the modules needed to manage Grafana Cloud stacks and resources. + ## Create a Cloud stack -1. Create a Grafana Cloud Access Policy and get a token. - You'll need this for the Ansible playbook to be able to create a Grafana Cloud stack. - Refer to [Create a Grafana Cloud Access Policy](/docs/grafana-cloud/security-and-account-management/authentication-and-permissions/access-policies/create-access-policies/). +First, create a Grafana Cloud Access Policy and get a token. You'll need this for the Ansible playbook to be able to create a Grafana Cloud stack. Refer to [Create a Grafana Cloud Access Policy](/docs/grafana-cloud/security-and-account-management/authentication-and-permissions/access-policies/create-access-policies/). -1. Create an Ansible playbook file. +Next, create an Ansible playbook file. This Ansible playbook creates a Grafana Cloud stack using the [Cloud stack module](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/cloud_stack_module.html#ansible-collections-grafana-grafana-cloud-stack-module). - This Ansible playbook will create a Grafana Cloud stack by using the [Cloud stack module](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/cloud_stack_module.html#ansible-collections-grafana-grafana-cloud-stack-module). +To do so, create a file named `cloud-stack.yml` and add the following: - Create a file named `cloud-stack.yml` and add the following: +```yaml +- name: Create Grafana Cloud stack + connection: local + hosts: localhost - ```yaml - - name: Create Grafana Cloud stack - connection: local - hosts: localhost + vars: + grafana_cloud_api_key: '' + stack_name: '' + org_name: '' - vars: - grafana_cloud_api_key: '' - stack_name: '' - org_name: '' + tasks: + - name: Create a Grafana Cloud stack + grafana.grafana.cloud_stack: + name: '{{ stack_name }}' + stack_slug: '{{ stack_name }}' + cloud_api_key: '{{ grafana_cloud_api_key }}' + org_slug: '{{ org_name }}' + delete_protection: true + state: present + register: stack_result - tasks: - - name: Create a Grafana Cloud stack - grafana.grafana.cloud_stack: - name: '{{ stack_name }}' - stack_slug: '{{ stack_name }}' - cloud_api_key: '{{ grafana_cloud_api_key }}' - org_slug: '{{ org_name }}' - delete_protection: true - state: present - ``` + - name: Display stack URL + debug: + msg: 'Stack created at: {{ stack_result.url }}' +``` -1. Replace the following field values: - - `` with a token from the Cloud Access Policy you created in the Grafana Cloud portal. - - `` with the name of your stack. - - `` with the name of the organization in Grafana Cloud. +Replace the placeholders with your values: -## Create an API key in the Grafana stack +- _``_: Token from the Cloud Access Policy you created in the Grafana Cloud portal +- _``_: Name of your stack +- _``_: Name of the organization in Grafana Cloud -Create an API key in the Grafana stack. -You'll need this key to configure Ansible to be able to create data source, folders, and dashboards. +The playbook registers the stack creation result and displays the stack URL, which you'll need for subsequent resource management. + +## Create an API key in your Grafana stack + +Create an API key in the Grafana stack. You'll need this key to configure Ansible to create data sources, folders, and dashboards. 1. Log into your Grafana Cloud instance. 2. Click **Administration** and select **API keys**. @@ -70,171 +84,169 @@ You'll need this key to configure Ansible to be able to create data source, fold 5. In **Role**, select **Admin** or **Editor** to associate the role with this API key. 6. Click **Copy** to save it for later use. -## Add a data source +## Add resources using playbooks -This guide uses the InfluxDB data source. -The required arguments vary depending on the type of data source you select. +### Add a data source -1. Create a file named `data-source.yml` and add the following: +The following steps use the InfluxDB data source. The required arguments vary depending on the type of data source you select. - ```yaml - - name: Add/Update data source - connection: local - hosts: localhost +Create a file named `data-source.yml`: - vars: - data_sources: - [ - { - name: '', - type: 'influxdb', - url: '', - user: '', - secureJsonData: { password: '' }, - database: '', - id: , - uid: '', - access: 'proxy', - }, - ] +```yaml +- name: Add/Update data source + connection: local + hosts: localhost - grafana_api_key: '' - stack_name: '' + vars: + grafana_url: 'https://.grafana.net' + grafana_api_key: '' + data_source_config: + name: '' + type: 'influxdb' + url: '' + user: '' + secureJsonData: + password: '' + database: '' + uid: '' + access: 'proxy' - tasks: - - name: Create/Update Data sources - grafana.grafana.datasource: - datasource: '{{ item }}' - stack_slug: '{{ stack_name }}' - grafana_api_key: '{{ grafana_api_key }}' - state: present - loop: '{{ data_sources }}' - ``` + tasks: + - name: Create/Update Data source + grafana.grafana.datasource: + dataSource: '{{ data_source_config }}' + grafana_url: '{{ grafana_url }}' + grafana_api_key: '{{ grafana_api_key }}' + state: present +``` -1. Replace the following field values: - - `` with the name of the data source to be added in Grafana. - - `` with URL of your data source. - - `` with the username for authenticating with your data source. - - `` with the password for authenticating with your data source. - - `` with name of your database. - - `` with the ID for your data source in Grafana. - - `` wth the UID for your data source in Grafana. - - `` with the name of your stack. - - `` with the [API key created in the Grafana instance](#create-an-api-key-in-the-grafana-stack). +Replace the placeholders with your values: -## Add a folder +- _``_: Name of the data source to be added in Grafana +- _``_: URL of your data source +- _``_: Username for authenticating with your data source +- _``_: Password for authenticating with your data source +- _``_: Name of your database +- _``_: UID for your data source in Grafana +- _``_: Name of your stack +- _``_: API key created in the Grafana instance -This Ansible playbook creates a folder in your Grafana instance by using the [Folder module](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/folder_module.html#ansible-collections-grafana-grafana-folder-module). +### Add a folder -1. Create a file named `folder.yml` and add the following: +This playbook creates a folder in your Grafana instance using the [Folder module](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/folder_module.html#ansible-collections-grafana-grafana-folder-module). - ```yaml - - name: Add/Update Folders - connection: local - hosts: localhost +Create a file named `folder.yml`: - vars: - folders: [{ title: '', uid: '' }] +```yaml +- name: Add/Update Folders + connection: local + hosts: localhost - stack_name: '' - grafana_api_key: +vars: + grafana_url: 'https://.grafana.net' + grafana_api_key: '' + folders: + - title: '' + uid: '' - tasks: - - name: Create/Update a Folder in Grafana - grafana.grafana.folder: - title: '{{ item.title }}' - uid: '{{ item.uid }}' - stack_slug: '{{ stack_name }}' - grafana_api_key: '{{ grafana_api_key }}' - state: present - loop: '{{ folders }}' - ``` + tasks: + - name: Create/Update a Folder in Grafana + grafana.grafana.folder: + title: '{{ item.title }}' + uid: '{{ item.uid }}' + grafana_url: '{{ grafana_url }}' + grafana_api_key: '{{ grafana_api_key }}' + state: present + loop: '{{ folders }}' +``` -1. Replace the following field values: - - `` with the name of the folder to be added in Grafana. - - `` with the UID for your folder in Grafana. - - `` with the name of your stack. - - `` with the [API key created in the Grafana instance](#create-an-api-key-in-the-grafana-stack). +Replace the placeholders with your values: -## Add a dashboard to the folder +- _``_: Name of the folder to be added in Grafana +- _``_: UID for your folder in Grafana +- _``_: Name of your stack +- _``_: API key created in the Grafana instance -This Ansible playbook iterates through the dashboard JSON source code files in the folder referenced in `dashboards_path` and adds them in the Grafana instance by using the [Dashboard module](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/dashboard_module.html#ansible-collections-grafana-grafana-dashboard-module). +### Add a dashboard to the folder -1. Create a file named `dashboard.yml` and add the following: +This playbook iterates through the dashboard JSON source code files in the folder referenced in `dashboards_path` and adds them to the Grafana instance using the [Dashboard module](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/dashboard_module.html#ansible-collections-grafana-grafana-dashboard-module). - ```yaml - - name: Add/Update Dashboards - connection: local - hosts: localhost +Create a file named `dashboard.yml`: - vars: - dashboards_path: # Example "./dashboards" - stack_name: "" - grafana_api_key: +```yaml +- name: Add/Update Dashboards + connection: local + hosts: localhost - tasks: - - name: Find dashboard files - find: - paths: "{{ dashboards_path }}" - file_type: file - recurse: Yes - patterns: "*.json" - register: files_matched - no_log: True + vars: + grafana_url: 'https://.grafana.net' + grafana_api_key: '' + dashboards_path: '' # Example "./dashboards" - - name: Create list of dashboard file names - set_fact: - dashboard_file_names: "{{ dashboard_file_names | default ([]) + [item.path] }}" - loop: "{{ files_matched.files }}" - no_log: True + tasks: + - name: Find dashboard files + find: + paths: '{{ dashboards_path }}' + file_type: file + recurse: true + patterns: '*.json' + register: files_matched + no_log: true - - name: Create/Update a dashboard - grafana.grafana.dashboard: - dashboard: "{{ lookup('ansible.builtin.file','{{ item }}' ) }}" - stack_slug: "{{ stack_name }}" - grafana_api_key: "{{ grafana_api_key }}" - state: present - loop: "{{ dashboard_file_names }}" - ``` + - name: Create list of dashboard file names + set_fact: + dashboard_file_names: '{{ dashboard_file_names | default([]) + [item.path] }}' + loop: '{{ files_matched.files }}' + no_log: true -1. Replace the following field values: - - `` with the path to the folder containing dashboard JSON source code files. - - `` with the name of your stack. - - `` with the [API key created in the Grafana instance](#create-an-api-key-in-the-grafana-stack). + - name: Create/Update a dashboard + grafana.grafana.dashboard: + dashboard: "{{ lookup('ansible.builtin.file', item) }}" + grafana_url: '{{ grafana_url }}' + grafana_api_key: '{{ grafana_api_key }}' + state: present + loop: '{{ dashboard_file_names }}' +``` + +Replace the placeholders with your values: + +- _``_: Path to the folder containing dashboard JSON source code files +- _``_: Name of your stack +- _``_: API key created in the Grafana instance ## Run the Ansible playbooks In a terminal, run the following commands from the directory where all of the Ansible playbooks are located. -1. To create the Grafana Cloud stack. +Create the Grafana Cloud stack: - ```shell - ansible-playbook cloud-stack.yml - ``` +```sh +ansible-playbook cloud-stack.yml +``` -1. To add a data source to the Grafana stack. +Add a data source to the Grafana stack: - ```shell - ansible-playbook data-source.yml - ``` +```sh +ansible-playbook data-source.yml +``` -1. To add a folder to the Grafana stack +Add a folder to the Grafana stack: - ```shell - ansible-playbook folder.yml - ``` +```sh +ansible-playbook folder.yml +``` -1. To add a dashboard to the folder in your Grafana stack. +Add a dashboard to the folder in your Grafana stack: - ```shell - ansible-playbook dashboard.yml - ``` +```sh +ansible-playbook dashboard.yml +``` -## Validation +## Validate your configuration -Once you run the Ansible playbooks, you should be able to verify the following: +After you've run the Ansible playbooks, you can verify the following: -- The new Grafana stack is created and visible in the Cloud Portal. +- The new Grafana Cloud stack is created and visible in the Cloud Portal. ![Cloud Portal](/static/img/docs/grafana-cloud/terraform/cloud_portal_tf.png) @@ -242,18 +254,22 @@ Once you run the Ansible playbooks, you should be able to verify the following: ![InfluxDB datasource](/media/docs/grafana-cloud/screenshot-influxdb_datasource_tf.png) -- A new folder in Grafana. - In the following image, a folder named `Demos` was added. +- A new folder is available in your Grafana stack. In the following image, a folder named `Demos` was added. ![Folder](/media/docs/grafana-cloud/screenshot-folder_tf.png) -- A new dashboard in the Grafana stack. - In the following image a dashboard named `InfluxDB Cloud Demos` was created inside the "Demos" folder. +- A new dashboard is visible in the Grafana stack. In the following image, a dashboard named `InfluxDB Cloud Demos` was created inside the "Demos" folder. ![InfluxDB dashboard](/static/img/docs/grafana-cloud/terraform/influxdb_dashboard_tf.png) -## Summary +## Next steps -In this guide, you created a Grafana Cloud stack along with a data source, folder, and dashboard imported from a JSON file using Ansible. +You've successfully created a Grafana Cloud stack along with a data source, a folder, and a dashboard using Ansible. Your Grafana infrastructure is now managed through code. -To learn more about managing Grafana using Ansible, refer to the [Grafana Ansible collection](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/). +To learn more about managing Grafana with Infrastructure as code: + +- [Grafana Ansible collection documentation](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/) +- [Ansible playbook best practices](https://docs.ansible.com/ansible/latest/user_guide/playbooks_best_practices.html) +- [Grafana API documentation](/docs/grafana/latest/developers/http_api/) +- [Grafana Cloud API documentation](https://grafana.com/docs/grafana-cloud/developer-resources/api-reference/) +- [Infrastructure as Code with Terraform](/docs/grafana/latest/as-code/infrastructure-as-code/terraform/) diff --git a/docs/sources/as-code/infrastructure-as-code/ansible/ansible-grafana-agent-linux/index.md b/docs/sources/as-code/infrastructure-as-code/ansible/ansible-grafana-agent-linux/index.md deleted file mode 100644 index 8fa3a6f8357..00000000000 --- a/docs/sources/as-code/infrastructure-as-code/ansible/ansible-grafana-agent-linux/index.md +++ /dev/null @@ -1,156 +0,0 @@ ---- -keywords: - - Infrastructure as Code - - Quickstart - - Grafana Cloud - - Ansible -title: Install Grafana Agent on a Linux host using Ansible -weight: 200 -canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/ansible/ansible-grafana-agent-linux/ ---- - -# Install Grafana Agent on a Linux host using Ansible - -{{< docs/shared lookup="agent-deprecation.md" source="alloy" version="next" >}} - -This guide shows how to install Grafana Agent on a Linux host using [Ansible](https://www.ansible.com/) and to use it to push logs to Grafana Cloud. - -## Before you begin - -Before you begin, you should have the following available: - -- A Grafana Cloud account. -- A Linux machine -- Command line (terminal) access to that Linux machine with `unzip` binary installed -- Account permissions sufficient to install and use Grafana Agent on the Linux machine -- [Ansible](https://docs.ansible.com/ansible/latest/installation_guide/index.html) installed on the Linux machine - -## Choose your Grafana Agent installation method - -This guide covers two methods for installing and configuring Grafana Agent using Ansible: - -- Installing Grafana Agent in Flow mode -- Installing Grafana Agent in static mode - -Depending on your specific needs and the configuration of your environment, you may choose one method over the other for better compatibility or ease of setup. - - - -### Install Grafana Agent in flow mode using Ansible - -This Ansible playbook installs Grafana Agent in Flow mode and also creates a systemd service to manage it. - -It creates a user named `grafana-agent` on the Linux machine for running Grafana Agent. - -1. Create a file named `grafana-agent.yml` and add the following: - -```yaml -- name: Install Grafana Agent Flow - hosts: all - become: true - tasks: - - name: Install Grafana Agent Flow - ansible.builtin.include_role: - name: grafana.grafana.grafana_agent - vars: - grafana_agent_mode: flow - # Change config file on the host to .river - grafana_agent_config_filename: config.river - # Change config file to be copied - grafana_agent_provisioned_config_file: '' - # Remove default flags - grafana_agent_flags_extra: - server.http.listen-addr: '0.0.0.0:12345' -``` - -1. Replace the following field values: - - `` with the path to river configuration file on the Ansible Controller (Localhost). - -### Install Grafana Agent in static mode using Ansible - -This Ansible playbook installs Grafana Agent in static mode and also creates a systemd service to manage it. -It creates a user named `grafana-agent` on the Linux machine for running Grafana Agent. - -1. Create a file named `grafana-agent.yml` and add the following: - -```yaml -- name: Install Grafana Agent in static mode - hosts: all - become: true - - vars: - grafana_cloud_api_key: - logs_username: # Example - 411478 - loki_url: # Example - https://logs-prod-017.grafana.net/loki/api/v1/push - tasks: - - name: Install Grafana Agent in static mode - ansible.builtin.include_role: - name: grafana_agent - vars: - grafana_agent_logs_config: - configs: - - clients: - - basic_auth: - password: '{{ grafana_cloud_api_key }}' - username: '{{ logs_username }}' - url: '{{ loki_url }}' - name: default - positions: - filename: /tmp/positions.yaml - scrape_configs: - - job_name: integrations/node_exporter_direct_scrape - static_configs: - - targets: - - localhost - labels: - instance: hostname - __path__: /var/log/*.log - job: integrations/node_exporter - target_config: - sync_period: 10s -``` - -1. Replace the following field values: - - `` with a token from the Cloud Access Policy you created in the Grafana Cloud portal. - - `` with the Loki Username - - `` with the push endpoint URL of Loki Instance - -## Run the Ansible playbook on the Linux machine - -In the Linux machine's terminal, run the following command from the directory where the Ansible playbook is located. - -```shell -ansible-playbook grafana-agent.yml -``` - -## Validate - - - -1. Grafana Agent service on the Linux machine should be `active` and `running`. You should see a similar output: - - -```shell -$ sudo systemctl status grafana-agent.service - grafana-agent.service - Grafana Agent - Loaded: loaded (/etc/systemd/system/grafana-agent.service; enabled; vendor preset: enabled) - Active: active (running) since Wed 2022-07-20 09:56:15 UTC; 36s ago - Main PID: 3176 (agent-linux-amd) - Tasks: 8 (limit: 515) - Memory: 92.5M - CPU: 380ms - CGroup: /system.slice/grafana-agent.service - └─3176 /usr/local/bin/agent-linux-amd64 --config.file=/etc/grafana-cloud/agent-config.yaml -``` - -1. In a Grafana Cloud stack, click **Explore** in the left-side menu. - -1. At the top of the page, use the dropdown menu to select your Loki logs data source. In the Log Browser, run the query `{job="integrations/node_exporter"}` - - ![Loki Logs](/static/img/docs/grafana-cloud/ansible/ansible-agent-logs.png) - -## Summary - -In this guide, you installed Grafana Agent on a Linux node using Ansible and used it to pushed logs to Grafana Cloud. - -To learn more about the Grafana Ansible collection, refer to the [GitHub repository](https://github.com/grafana/grafana-ansible-collection) or its [documentation](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/index.html). diff --git a/docs/sources/as-code/infrastructure-as-code/ansible/ansible-multiple-agents/index.md b/docs/sources/as-code/infrastructure-as-code/ansible/ansible-multiple-agents/index.md deleted file mode 100644 index c6769e5ebde..00000000000 --- a/docs/sources/as-code/infrastructure-as-code/ansible/ansible-multiple-agents/index.md +++ /dev/null @@ -1,207 +0,0 @@ ---- -menuTitle: Monitor multiple Linux hosts with the grafana_agent role -title: Monitor multiple Linux hosts with grafana_agent role -weight: 300 -canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/ansible/ansible-multiple-agents/ ---- - -# Monitor multiple Linux hosts with the `grafana_agent` role - -{{< docs/shared lookup="agent-deprecation.md" source="alloy" version="next" >}} - -Monitoring multiple Linux hosts can be difficult. -To make it easier, you can use the `grafana_agent` role with the [Grafana Ansible collection](../). -This guide shows how to use the `grafana_agent` Ansible role to deploy and manage Grafana Agent across multiple Linux hosts so you can monitor them using Grafana Cloud. - -## Before you begin - -Before you begin, you should have: - -- Linux hosts -- SSH access to the Linux hosts -- Account permissions sufficient to install and use Grafana Agent on the Linux hosts - -## Install the Grafana Ansible collection - -The [`grafana_agent` role](https://github.com/grafana/grafana-ansible-collection/tree/main/roles/grafana_agent) is available in the Grafana Ansible collection as of the 1.1.0 release. - -To install the Grafana Ansible collection, run this command: - -``` -ansible-galaxy collection install grafana.grafana -``` - -## Create an Ansible inventory file - -Next, you will set up your hosts and create an inventory file. - -1. Create your hosts and add public SSH keys to them. - - This example uses eight Linux hosts: two Ubuntu hosts, two CentOS hosts, two Fedora hosts, and two Debian hosts. - -1. Create an Ansible inventory file. - - The Ansible inventory, which resides in a file named `inventory`, looks similar to this: - - ``` - 146.190.208.216 # hostname = ubuntu-01 - 146.190.208.190 # hostname = ubuntu-02 - 137.184.155.128 # hostname = centos-01 - 146.190.216.129 # hostname = centos-02 - 198.199.82.174 # hostname = debian-01 - 198.199.77.93 # hostname = debian-02 - 143.198.182.156 # hostname = fedora-01 - 143.244.174.246 # hostname = fedora-02 - ``` - -1. Create an `ansible.cfg` file within the same directory as `inventory`, with the following values: - ``` - [defaults] - inventory = inventory # Path to the inventory file - private_key_file = ~/.ssh/id_rsa # Path to my private SSH Key - remote_user=root # username - ``` - {{< admonition type="note" >}} - If you are copying the previously listed files, remove the comments (#). - {{< /admonition >}} - -## Use the `grafana_agent` Ansible role - -Next you will create an Ansible playbook that calls the `grafana_agent` role from the `grafana.grafana` Ansible collection. - -To use the `grafana_agent` Ansible role: - -1. Create a file named `deploy-agent.yml` in the same directory as `ansible.cfg` and `inventory` and add the configuration below. - - ```yaml - - name: Install Grafana Agent - hosts: all - become: true - - vars: - grafana_cloud_api_key: - metrics_username: # Example - 825019 - logs_username: # Example - 411478 - prometheus_url: # Example - https://prometheus-us-central1.grafana.net/api/prom/push - loki_url: # Example - https://logs-prod-017.grafana.net/loki/api/v1/push - tasks: - - name: Install Grafana Agent - ansible.builtin.include_role: - name: grafana.grafana.grafana_agent - vars: - grafana_agent_metrics_config: - configs: - - name: integrations - remote_write: - - basic_auth: - password: '{{ grafana_cloud_api_key }}' - username: '{{ metrics_username }}' - url: '{{ prometheus_url }}' - - global: - scrape_interval: 60s - wal_directory: /tmp/grafana-agent-wal - grafana_agent_logs_config: - configs: - - name: default - clients: - - basic_auth: - password: '{{ grafana_cloud_api_key }}' - username: '{{ logs_username }}' - url: '{{ loki_url }}' - positions: - filename: /tmp/positions.yaml - target_config: - sync_period: 10s - scrape_configs: - - job_name: varlogs - static_configs: - - targets: [localhost] - labels: - instance: ${HOSTNAME:-default} - job: varlogs - __path__: /var/log/*log - grafana_agent_integrations_config: - node_exporter: - enabled: true - instance: ${HOSTNAME:-default} - prometheus_remote_write: - - basic_auth: - password: '{{ grafana_cloud_api_key }}' - username: '{{ metrics_username }}' - url: '{{ prometheus_url }}' - grafana_agent_env_vars: - HOSTNAME: '%H' - ``` - - The playbook calls the `grafana_agent` role from the `grafana.grafana` Ansible collection. - - The Agent configuration in this playbook send metrics and logs from the Linux hosts to Grafana Cloud along with the hostname of each instance - - Refer to the [Grafana Ansible documentation](https://github.com/grafana/grafana-ansible-collection/tree/main/roles/grafana_agent#role-variables) to understand the other variables you can pass to the `grafana_agent` role. - - When deploying the Agent across multiple instances for monitoring them, It is essential that the Agent is able to auto-detect the hostname for ease in monitoring. - Notice that the label `instance` has been set to the value `${HOSTNAME:-default}`, which is substituted by the value of the HOSTNAME environment variable in the Linux host. - - To read more about the variable substitution, refer to the Grafana Agent [node_exporter_config](/docs/grafana-cloud/send-data/agent/static/configuration/integrations/node-exporter-config/) documentation. - -1. To run the playbook, run this command: - - ``` - ansible-playbook deploy-agent.yml - ``` - -{{< admonition type="note" >}} -You can place the `deploy-agent.yml`, `ansible.cfg` and `inventory` files in different directories based on your needs. -{{< /admonition >}} - -## Check that logs and metrics are being ingested into Grafana Cloud - -Logs and metrics will soon be available in Grafana Cloud. -To test this, use the Explore feature. -Click the **Explore** icon (compass icon) in the vertical navigation bar. - -### Check logs - -To check logs: - -1. Use the drop-down menu at the top of the page to select your Loki logs data source. - -1. In the log browser, run the query `{instance="centos-01"}` where `centos-01` is the hostname of one of the Linux hosts. - - If you see log lines (shown in the example below), logs are being received. - - {{< figure alt="Grafana Explore showing a graph and log output from the preceding query" src="/static/assets/img/blog/ansible-to-manage-agent1.png" >}} - - If no log lines appear, logs aren't being collected. - -### Check metrics - -To check metrics: - -1. Use the drop-down menu at the top of the page to select your Prometheus data source. - -1. Run the query `{instance="centos-01"}` where `centos-01` is the hostname of one of the Linux hosts. - - If you see a metrics graph and table (shown in the example below), metrics are being received. - - {{< figure alt="Grafana Explore showing a graph and metrics table output from the preceding query" src="/static/assets/img/blog/ansible-to-manage-agent2.png" >}} - - If no metrics appear, metrics aren't being collected. - -### View dashboards - -Now that you have logs and metrics in Grafana, you can use dashboards to view them. -Here's an example of one of the prebuilt dashboards included with the Linux integration in Grafana Cloud: - -{{< figure alt="The Grafana Node Exporter integration dashboard showing panels of visualizations" src="/static/assets/img/blog/ansible-to-manage-agent3.png" >}} - -Using the **Instance** drop-down in the dashboard, you can select from the hostnames where you deployed Grafana Agent and start monitoring them. - -## Summary - -The `grafana_agent` Ansible role makes it easy to deploy and manage Grafana Agent across multiple machines. -This example showed Grafana Agent deployments across eight Linux hosts, but it's possible to monitor more hosts using the`grafana_agent` role. -To add monitor more Linux hosts, update the `inventory` file and re-run the Ansible playbook. - -To learn more about the Grafana Ansible collection, see its [GitHub repository](https://github.com/grafana/grafana-ansible-collection) or its [documentation](https://docs.ansible.com/ansible/latest/collections/grafana/grafana/index.html). diff --git a/docs/sources/as-code/infrastructure-as-code/grafana-operator/manage-dashboards-argocd.md b/docs/sources/as-code/infrastructure-as-code/grafana-operator/manage-dashboards-argocd.md index 3c92270e860..0531a0c803f 100644 --- a/docs/sources/as-code/infrastructure-as-code/grafana-operator/manage-dashboards-argocd.md +++ b/docs/sources/as-code/infrastructure-as-code/grafana-operator/manage-dashboards-argocd.md @@ -5,295 +5,298 @@ keywords: - Grafana Cloud - Grafana Operator - ArgoCD -title: Manage Dashboards with GitOps Using ArgoCD +title: Manage dashboards with GitOps using ArgoCD +menuTitle: Manage dashboards with ArgoCD weight: 110 canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/grafana-operator/manage-dashboards-argocd/ --- -# Managing Grafana Dashboards with GitOps Using ArgoCD +# Manage Grafana dashboards with GitOps using ArgoCD -This guide will walk you through setting up a continuous deployment pipeline using ArgoCD to synchronize your Grafana dashboards with a Git repository. We'll use the Grafana Dashboard Custom Resource provided by the Grafana Operator to manage dashboard configurations declaratively. +This guide shows you how to set up a continuous deployment pipeline using ArgoCD to synchronize your Grafana dashboards with a Git repository. You'll use the Grafana Dashboard Custom Resource provided by the Grafana Operator to manage dashboard configurations declaratively. ## Prerequisites +Before you begin, make sure you have the following: + - An existing Grafana Cloud stack -- A Kubernetes cluster with Grafana Operator installed, as shown in [Grafana Operator Installation](/docs/grafana-cloud/as-code/infrastructure-as-code/grafana-operator/#installing-the-grafana-operator). -- ArgoCD installed on your Kubernetes cluster. Refer the [Installation Guide](https://argo-cd.readthedocs.io/en/stable/getting_started/). -- Git repository to store your dashboard configurations. +- A Kubernetes cluster with Grafana Operator installed, as shown in [Grafana Operator Installation](/docs/grafana-cloud/as-code/infrastructure-as-code/grafana-operator/#installing-the-grafana-operator) +- ArgoCD installed on your Kubernetes cluster. Refer to the [ArgoCD Installation Guide](https://argo-cd.readthedocs.io/en/stable/getting_started/) +- A Git repository to store your dashboard configurations -## Set Up Your Git Repository +## Set up your Git repository -Within the repository, create a directory structure to organize your grafana and dashboard configurations. For this tutorial, lets create a folder named `grafana`. +Create a directory structure in your repository to organize your Grafana and dashboard configurations. For this tutorial, create a folder named `grafana`. -## Grafana Operator Setup +## Set up the Grafana Operator -The Grafana Operator allows us to authenticate with the Grafana instance using the Grafana Custom Resource (CR). +The Grafana Operator allows you to authenticate with the Grafana instance using the Grafana Custom Resource (CR). -1. **Create the Grafana API Token Secret:** +### Create the Grafana API Token Secret -Store the Grafana API Token in a secret with the following content in a file named `grafana-token.yml` in the `grafana` folder in your Git repo: +Store the Grafana API Token in a secret. Create a file named `grafana-token.yml` in the `grafana` folder in your Git repository: ```yaml apiVersion: v1 kind: Secret metadata: name: grafana-cloud-credentials - namespace: + namespace: '' stringData: - GRAFANA_CLOUD_INSTANCE_TOKEN: + GRAFANA_CLOUD_INSTANCE_TOKEN: '' type: Opaque ``` -Replace the following field values: +Replace the placeholders with your values: -- `` with API key from the Grafana instance. To create an API key, refer [Grafana API Key Documentation](/docs/grafana/latest/administration/api-keys/). -- `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +- _``_: API key from your Grafana instance. To create an API key, refer to [Grafana API Key Documentation](/docs/grafana/latest/administration/api-keys/) +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster -2. **Configure the Grafana Custom Resource:** +### Configure the Grafana Custom Resource -Set up connection to your Grafana Cloud instance by creating a file named `grafana-cloud.yml` in the `grafana` folder in your Git repo with the following contents: +Set up the connection to your Grafana Cloud instance. Create a file named `grafana-cloud.yml` in the `grafana` folder in your Git repository: ```yaml apiVersion: grafana.integreatly.org/v1beta1 kind: Grafana metadata: - name: - namespace: + name: '' + namespace: '' labels: - dashboards: + dashboards: '' spec: external: - url: https://.grafana.net/ + url: https://.grafana.net/ apiKey: name: grafana-cloud-credentials key: GRAFANA_CLOUD_INSTANCE_TOKEN ``` -Replace the following field values: +Replace the placeholders with your values: -- `` with API key from the Grafana instance. -- `` with the name of your Grafana Cloud Stack. -- `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +- _``_: Name of your Grafana Cloud Stack +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster -## Add Dashboards to a Git repository +## Add dashboards to your Git repository -In your `grafana` directory, Create a sub-folder called `dashboards`. For this tutorial, we will create 3 seperate dashboards. +In your `grafana` directory, create a sub-folder called `dashboards`. -1. Under `dashboards` folder, Create a file named `simple-dashboard.yaml` with the following content for the first dashboard: +This guide shows you how to creates three separate dashboards. For all dashboard configurations, replace the placeholders with your values: - ```yaml - apiVersion: grafana.integreatly.org/v1beta1 - kind: GrafanaDashboard - metadata: - name: grafanadashboard-sample - namespace: - spec: - resyncPeriod: 30s - instanceSelector: - matchLabels: - dashboards: - json: > - { - "id": null, - "title": "Simple Dashboard", - "tags": [], - "style": "dark", - "timezone": "browser", - "editable": true, - "hideControls": false, - "graphTooltip": 1, - "panels": [], - "time": { - "from": "now-6h", - "to": "now" - }, - "timepicker": { - "time_options": [], - "refresh_intervals": [] - }, - "templating": { - "list": [] - }, - "annotations": { - "list": [] - }, - "refresh": "5s", - "schemaVersion": 17, - "version": 0, - "links": [] - } - ``` +- _``_: Name of your Grafana Cloud Stack +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster - Replace the following field values: - - `` with the name of your Grafana Cloud Stack. - - `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +### Create a simple dashboard -1. Under `dashboards` folder, Create a file named `dashboard-from-cm.yaml` with the following content for the second dashboard: +Under the `dashboards` folder, create a file named `simple-dashboard.yaml`: - ```yaml - apiVersion: v1 - kind: ConfigMap - metadata: - name: dashboard-definition - namespace: - spec: - resyncPeriod: 30s - instanceSelector: - matchLabels: - dashboards: - json: > - { - "id": null, - "title": "Simple Dashboard from ConfigMap", - "tags": [], - "style": "dark", - "timezone": "browser", - "editable": true, - "hideControls": false, - "graphTooltip": 1, - "panels": [], - "time": { - "from": "now-6h", - "to": "now" - }, - "timepicker": { - "time_options": [], - "refresh_intervals": [] - }, - "templating": { - "list": [] - }, - "annotations": { - "list": [] - }, - "refresh": "5s", - "schemaVersion": 17, - "version": 0, - "links": [] - } - --- - apiVersion: grafana.integreatly.org/v1beta1 - kind: GrafanaDashboard - metadata: - name: grafanadashboard-from-configmap - namespace: - spec: - instanceSelector: - matchLabels: - dashboards: - configMapRef: - name: dashboard-definition - key: json - ``` +```yaml +apiVersion: grafana.integreatly.org/v1beta1 +kind: GrafanaDashboard +metadata: + name: grafanadashboard-sample + namespace: '' +spec: + resyncPeriod: 30s + instanceSelector: + matchLabels: + dashboards: '' + json: > + { + "id": null, + "title": "Simple Dashboard", + "tags": [], + "style": "dark", + "timezone": "browser", + "editable": true, + "hideControls": false, + "graphTooltip": 1, + "panels": [], + "time": { + "from": "now-6h", + "to": "now" + }, + "timepicker": { + "time_options": [], + "refresh_intervals": [] + }, + "templating": { + "list": [] + }, + "annotations": { + "list": [] + }, + "refresh": "5s", + "schemaVersion": 17, + "version": 0, + "links": [] + } +``` - Replace the following field values: - - `` with the name of your Grafana Cloud Stack. - - `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +### Create a dashboard from ConfigMap -1. Under `dashboards` folder, Create a file named `dashboard-from-id.yaml` with the following content for the third dashboard: +Under the `dashboards` folder, create a file named `dashboard-from-cm.yaml`: - ```yaml - apiVersion: grafana.integreatly.org/v1beta1 - kind: GrafanaDashboard - metadata: - name: node-exporter-latest - namespace: - spec: - instanceSelector: - matchLabels: - dashboards: - grafanaCom: - id: 1860 - ``` +```yaml +apiVersion: v1 +kind: ConfigMap +metadata: + name: dashboard-definition + namespace: +data: + json: > + { + "id": null, + "title": "Simple Dashboard from ConfigMap", + "tags": [], + "style": "dark", + "timezone": "browser", + "editable": true, + "hideControls": false, + "graphTooltip": 1, + "panels": [], + "time": { + "from": "now-6h", + "to": "now" + }, + "timepicker": { + "time_options": [], + "refresh_intervals": [] + }, + "templating": { + "list": [] + }, + "annotations": { + "list": [] + }, + "refresh": "5s", + "schemaVersion": 17, + "version": 0, + "links": [] + } +--- +apiVersion: grafana.integreatly.org/v1beta1 +kind: GrafanaDashboard +metadata: + name: grafanadashboard-from-configmap + namespace: '' +spec: + instanceSelector: + matchLabels: + dashboards: '' + configMapRef: + name: dashboard-definition + key: json +``` - Replace the following field values: - - `` with the name of your Grafana Cloud Stack. - - `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +### Create a dashboard from Grafana.com -## Configure Argo CD to Sync the Git Repository +Under the `dashboards` folder, create a file named `dashboard-from-id.yaml`: -Once all changes are committed to Git, Log in to the Argo CD user interface or use the CLI. +```yaml +apiVersion: grafana.integreatly.org/v1beta1 +kind: GrafanaDashboard +metadata: + name: node-exporter-latest + namespace: '' +spec: + instanceSelector: + matchLabels: + dashboards: '' + grafanaCom: + id: 1860 +``` -2. Create an Argo CD application to manage the synchronization: +## Configure ArgoCD to sync the Git repository - **Using UI**: - - Navigate to 'New App' and fill out the form with your Git repository details and the path to your `grafana` folder. - - Make sure to tick mark directory Recurse. - - Set the sync policy to `Automatic`. +After you commit all changes to Git, log in to the ArgoCD user interface or use the CLI. - **Using CLI**: - - Prepare an application manifest named `argo-application.yaml` with the configuration pointing to your Git repository: +### Create an ArgoCD application - ```yaml - apiVersion: argoproj.io/v1alpha1 - kind: Application - metadata: - name: Grafana - namespace: - spec: - destination: - name: '' - namespace: '' - server: 'https://kubernetes.default.svc' - source: - path: - repoURL: '' - targetRevision: HEAD - directory: - recurse: true - sources: [] - project: default - syncPolicy: - automated: - prune: true - selfHeal: true - syncOptions: - - CreateNamespace=true - retry: - limit: 2 - backoff: - duration: 5s - maxDuration: 3m0s - factor: 2 - ``` +**Using the UI:** - Replace the following field values: - - `` with the URL of your GIT Repository. - - `` with the path to the `grafana` folder. - - `` with the namespace where ArgoCD is deployed in Kubernetes Cluster. +1. Navigate to **New App** and complete the form with your Git repository details and the path to your `grafana` folder +2. Enable **Directory Recurse** +3. Set the sync policy to **Automatic** - - Create the application in Argo CD: +**Using the CLI:** - ```shell - kubectl apply -f argo-application.yaml - ``` +Prepare an application manifest named `argo-application.yaml`: -## Verify Sync Status in Argo CD +```yaml +apiVersion: argoproj.io/v1alpha1 +kind: Application +metadata: + name: Grafana + namespace: '' +spec: + destination: + name: '' + namespace: '' + server: 'https://kubernetes.default.svc' + source: + path: '' + repoURL: '' + targetRevision: HEAD + directory: + recurse: true + sources: [] + project: default + syncPolicy: + automated: + prune: true + selfHeal: true + syncOptions: + - CreateNamespace=true + retry: + limit: 2 + backoff: + duration: 5s + maxDuration: 3m0s + factor: 2 +``` -1. Monitor the newly created Argo CD application, ensuring that it successfully syncs your dashboard configuration. +Replace the placeholders with your values: -2. Visit the Argo CD dashboard and check the sync status. If it's successful, your Grafana dashboard should be up to date with the configuration from your Git repository. +- _``_: URL of your Git repository +- _``_: Path to the `grafana` folder in your repository +- _``_: Namespace where ArgoCD is deployed in your Kubernetes cluster -## Updating the Dashboards +Create the application in ArgoCD: + +```sh +kubectl apply -f argo-application.yaml +``` + +## Verify sync status in ArgoCD + +1. Monitor the newly created ArgoCD application to ensure it successfully syncs your dashboard configuration +2. Visit the ArgoCD dashboard and check the sync status. If it's successful, your Grafana dashboards should be up to date with the configuration from your Git repository + +## Update your dashboards To update an existing dashboard: -1. Make changes to the dashboard JSON configuration in your Git repository. -2. Commit and push the changes. -3. Argo CD will detect the update and synchronize the changes to your Cutom Resource. -4. Grafana Operator will then sync changes to the Grafana Instance. +1. Make changes to the dashboard JSON configuration in your Git repository +2. Commit and push the changes +3. ArgoCD detects the update and synchronizes the changes to your Custom Resource +4. Grafana Operator then syncs changes to the Grafana instance -## Validating the Grafana Dashboard Update +### Validate your dashboard updates -Log in to your Grafana dashboard and confirm that the changes have been applied. You should see the dashboard update reflected in the Grafana UI. +Log in to your Grafana dashboard and confirm that the changes are applied. You should see the dashboard updates reflected in the Grafana UI. -## Additional Tips +## Next steps -- You can also install the Grafana Operator's Helm Chart using ArgoCD to manage your setup with GitOps. -- You can follow a similar setup for Grafana Dashboards and Folders. +You've successfully set up a GitOps workflow to manage Grafana dashboards using ArgoCD and the Grafana Operator. Your dashboards are now version-controlled and can be consistently deployed across environments. This approach provides a reliable and auditable way to manage observability dashboards and scale your operations. -## Conclusion +To learn more about managing Grafana using Grafana Operator: -You've set up a GitOps workflow to manage Grafana dashboards using Argo CD and the Grafana Operator. Your dashboards are now version-controlled and can be consistently deployed across environments. This approach provides a reliable and auditable way to manage observability dashboards and scale your operations. +- [Grafana Operator documentation](https://grafana.github.io/grafana-operator/docs/) +- [Grafana dashboard provisioning](/docs/grafana/latest/administration/provisioning/#dashboards) +- [ArgoCD best practices](https://argo-cd.readthedocs.io/en/stable/user-guide/best_practices/) -To learn more about managing Grafana using Grafana Operator, see the [Grafana Operator documentation](https://grafana.github.io/grafana-operator/docs/). +### Additional considerations + +- You can install the Grafana Operator's Helm Chart using ArgoCD to manage your setup with GitOps +- You can follow a similar setup for Grafana Folders and other resources diff --git a/docs/sources/as-code/infrastructure-as-code/grafana-operator/operator-dashboards-folders-datasources.md b/docs/sources/as-code/infrastructure-as-code/grafana-operator/operator-dashboards-folders-datasources.md index 9d8617e12c6..e5bbc1467b8 100644 --- a/docs/sources/as-code/infrastructure-as-code/grafana-operator/operator-dashboards-folders-datasources.md +++ b/docs/sources/as-code/infrastructure-as-code/grafana-operator/operator-dashboards-folders-datasources.md @@ -5,26 +5,27 @@ keywords: - Grafana Cloud - Grafana Operator title: Manage folders, data sources, and dashboards using Grafana Operator +menuTitle: Manage resources with the Grafana Operator weight: 100 canonical: https://grafana.com/docs/grafana/latest/as-code/infrastructure-as-code/grafana-operator/operator-dashboards-folders-datasources/ --- -# Creating and managing folders, data sources, and dashboards using the Grafana Operator +# Manage folders, data sources, and dashboards using the Grafana Operator -Learn how to manage data sources, folders and dashboard, using Grafana Operator. +This guide shows you how to manage data sources, folders, and dashboards using the Grafana Operator. You'll create these resources declaratively using Kubernetes custom resources. ## Prerequisites -Before you begin, you should have the following available: +Before you begin, make sure you have the following: -- An existing Grafana Cloud stack. -- Grafana Operator Installed in your Cluster, as shown in [Grafana Operator Installation](/docs/grafana-cloud/as-code/infrastructure-as-code/grafana-operator/#installing-the-grafana-operator). +- An existing Grafana Cloud stack +- Grafana Operator installed in your cluster, as shown in [Grafana Operator Installation](/docs/grafana-cloud/as-code/infrastructure-as-code/grafana-operator/#installing-the-grafana-operator) -## Grafana Operator Setup +## Set up the Grafana Operator -The Grafana Operator allows us to authenticate with the Grafana instance using the Grafana Custom Resource (CR). +The Grafana Operator allows you to authenticate with your Grafana instance using the Grafana Custom Resource (CR). -1. **Create the Grafana API Token Secret:** +### Create the Grafana API Token Secret Store the Grafana API Token in a secret with the following content in a file named `grafana-token.yml`: @@ -33,61 +34,64 @@ apiVersion: v1 kind: Secret metadata: name: grafana-cloud-credentials - namespace: + namespace: '' stringData: - GRAFANA_CLOUD_INSTANCE_TOKEN: + GRAFANA_CLOUD_INSTANCE_TOKEN: '' type: Opaque ``` -Replace the following field values: +Replace the placeholders with your values: -- `` with API key from the Grafana instance. To create an API key, refer [Grafana API Key Documentation](/docs/grafana/latest/administration/api-keys/). -- `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +- _``_: API key from your Grafana instance. To create an API key, refer to [Grafana API Key Documentation](/docs/grafana/latest/administration/api-keys/) +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster -2. **Configure the Grafana Custom Resource:** +### Configure the Grafana Custom Resource -Set up connection to your Grafana Cloud instance by creating a file named `grafana-cloud.yml` with the following contents: +Set up connection to your Grafana Cloud instance. Create a file named `grafana-cloud.yml`: ```yaml apiVersion: grafana.integreatly.org/v1beta1 kind: Grafana metadata: - name: - namespace: + name: '' + namespace: '' labels: - dashboards: + dashboards: '' spec: external: - url: https://.grafana.net/ + url: https://.grafana.net/ apiKey: name: grafana-cloud-credentials key: GRAFANA_CLOUD_INSTANCE_TOKEN ``` -Replace the following field values: +Replace the placeholders with your values: -- `` with API key from the Grafana instance. -- `` with the name of your Grafana Cloud Stack. -- `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +- _``_: Name of your Grafana Cloud stack +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster ## Add a data source -The following steps use the Prometheus data source. The required arguments vary depending on the data source you select. +{{< admonition type="note" >}} -1. **Create the Data Source Configuration:** +This example uses the Prometheus data source. Note that the required arguments vary depending on the data source you select. -Save a new YAML file `datasource.yml` with the following content: +{{< /admonition >}} + +### Create a data source configuration + +Create and save a new YAML file `datasource.yml` with your data source's configuration: ```yaml apiVersion: grafana.integreatly.org/v1beta1 kind: GrafanaDatasource metadata: - name: - namespace: + name: '' + namespace: '' spec: instanceSelector: matchLabels: - dashboards: + dashboards: '' allowCrossNamespaceImport: true datasource: access: proxy @@ -95,74 +99,76 @@ spec: jsonData: timeInterval: 5s tlsSkipVerify: true - name: + name: '' type: prometheus - url: + url: '' ``` -Replace the following field values: +Replace the placeholders with your values: -- `` with the name of the data source to be added in Grafana. -- `` with URL of your data source. -- `` with the name of your Grafana Cloud Stack. -- `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +- _``_: Name of the data source to be added in Grafana +- _``_: URL of your data source +- _``_: Name of your Grafana Cloud stack +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster -## Add a dashboard to a folder +### Add a dashboard to a folder -Use the following YAML definition to create a simple dashboard in the Grafana instance under a custom folder. If the folder defined under spec.folder fields doesnt not exist, The operator will create it before placing the dashboard inside the folder. +Use the following YAML definition to create a simple dashboard in the Grafana instance under a custom folder. If the folder defined under the `spec.folder` field doesn't exist, the operator creates it before placing the dashboard inside the folder. -1. **Prepare the Dashboard Configuration File:** - -In `dashboard.yml`, define the dashboard and assign it to a folder: +Prepare the dashboard configuration. In `dashboard.yml`, define the dashboard and assign it to a folder: ```yaml apiVersion: grafana.integreatly.org/v1beta1 kind: GrafanaDashboard metadata: - name: - namespace: + name: '' + namespace: '' spec: instanceSelector: matchLabels: - dashboards: - folder: "" + dashboards: '' + folder: '' json: > - { - "title": "as-code dashboard", - “uid” : “ascode” - } + { + "title": "as-code dashboard", + "uid" : "ascode" + } ``` -Replace the following field values: +Replace the placeholders with your values: -- `` with the name of the folder in which you want the Dashboard to be created. -- `` with the name of your Grafana Cloud Stack. -- `` with the namespace where the grafana-operator is deployed in Kubernetes Cluster. +- _``_: Name of the folder in which you want the dashboard to be created +- _``_: Name of your Grafana Cloud stack +- _``_: Namespace where the `grafana-operator` is deployed in your Kubernetes cluster -## Apply Kubernetes Manifests +## Apply the Kubernetes manifests In a terminal, run the following commands from the directory where all of the above Kubernetes YAML definitions are located. -1. Create Kubernetes Custom resources for all of the above configurations. +Create Kubernetes Custom resources for all of the configurations: - ```shell - kubectl apply -f grafana-token.yml grafana-cloud.yml datasource.yml dashboard.yml - ``` +```sh +kubectl apply -f grafana-token.yml grafana-cloud.yml datasource.yml dashboard.yml +``` -## Validation +## Validate your configuration -Once you apply the configurations, you should be able to verify the following: +After you apply the configurations, verify that: -- A new data source is visible in Grafana. In the following image a datasource named `InfluxDB` was created. +- A new data source is visible in Grafana. In the following image, a data source named `InfluxDB` was created. ![InfluxDB datasource](/static/img/docs/grafana-cloud/terraform/influxdb_datasource_tf.png) -- A new dashboard and folder in Grafana. In the following image a dashboard named `InfluxDB Cloud Demos` was created inside the `Demos` folder. +- A new dashboard and folder have been created in Grafana. In the following image, a dashboard named `InfluxDB Cloud Demos` was created inside the `Demos` folder. ![InfluxDB dashboard](/static/img/docs/grafana-cloud/grizzly/grizzly-folder-dashboard-datasource.png) -## Conclusion +## Next steps -In this guide, you created a data source, folder, and dashboard using the Grafana Operator. +You've successfully created a data source, folder, and dashboard using the Grafana Operator. Your Grafana resources are now managed declaratively through Kubernetes custom resources. -To learn more about managing Grafana using Grafana Operator, see the [Grafana Operator documentation](https://grafana.github.io/grafana-operator/docs/). +To learn more about managing Grafana: + +- [Grafana Operator documentation](https://grafana.github.io/grafana-operator/docs/) +- [Grafana dashboard provisioning](/docs/grafana/latest/administration/provisioning/#dashboards) +- [Grafana data source provisioning](/docs/grafana/latest/administration/provisioning/#data-sources) diff --git a/docs/sources/as-code/observability-as-code/schema-v2/_index.md b/docs/sources/as-code/observability-as-code/schema-v2/_index.md index 5eb693f0f1d..9be869a8391 100644 --- a/docs/sources/as-code/observability-as-code/schema-v2/_index.md +++ b/docs/sources/as-code/observability-as-code/schema-v2/_index.md @@ -13,7 +13,7 @@ labels: - enterprise - oss title: JSON schema v2 -weight: 200 +weight: 500 canonical: https://grafana.com/docs/grafana/latest/as-code/observability-as-code/schema-v2/ aliases: - ../../observability-as-code/schema-v2/ # /docs/grafana/next/observability-as-code/schema-v2/ From 5d26bc5ee11dd73e3f1ac598bba01993c98d6048 Mon Sep 17 00:00:00 2001 From: Matheus Macabu Date: Thu, 20 Nov 2025 11:18:50 +0100 Subject: [PATCH 05/15] FeatureToggles: Remove feedbackButton unused toggle (#114222) --- packages/grafana-data/src/types/featureToggles.gen.ts | 4 ---- pkg/services/featuremgmt/registry.go | 7 ------- pkg/services/featuremgmt/toggles_gen.csv | 1 - pkg/services/featuremgmt/toggles_gen.go | 4 ---- pkg/services/featuremgmt/toggles_gen.json | 3 ++- 5 files changed, 2 insertions(+), 17 deletions(-) diff --git a/packages/grafana-data/src/types/featureToggles.gen.ts b/packages/grafana-data/src/types/featureToggles.gen.ts index b9afd13cec0..acb3b1796de 100644 --- a/packages/grafana-data/src/types/featureToggles.gen.ts +++ b/packages/grafana-data/src/types/featureToggles.gen.ts @@ -748,10 +748,6 @@ export interface FeatureToggles { */ alertingNotificationsStepMode?: boolean; /** - * Enables a button to send feedback from the Grafana UI - */ - feedbackButton?: boolean; - /** * Enable unified storage search UI */ unifiedStorageSearchUI?: boolean; diff --git a/pkg/services/featuremgmt/registry.go b/pkg/services/featuremgmt/registry.go index 68e88830be4..bc4d4c282ee 100644 --- a/pkg/services/featuremgmt/registry.go +++ b/pkg/services/featuremgmt/registry.go @@ -1298,13 +1298,6 @@ var ( FrontendOnly: true, Expression: "true", }, - { - Name: "feedbackButton", - Description: "Enables a button to send feedback from the Grafana UI", - Stage: FeatureStageExperimental, - Owner: grafanaOperatorExperienceSquad, - HideFromDocs: true, - }, { Name: "unifiedStorageSearchUI", Description: "Enable unified storage search UI", diff --git a/pkg/services/featuremgmt/toggles_gen.csv b/pkg/services/featuremgmt/toggles_gen.csv index e0f2bec13bc..8a874135d00 100644 --- a/pkg/services/featuremgmt/toggles_gen.csv +++ b/pkg/services/featuremgmt/toggles_gen.csv @@ -169,7 +169,6 @@ alertingEnrichmentPerRule,experimental,@grafana/alerting-squad,false,false,false alertingEnrichmentAssistantInvestigations,experimental,@grafana/alerting-squad,false,false,false alertingAIAnalyzeCentralStateHistory,experimental,@grafana/alerting-squad,false,false,false alertingNotificationsStepMode,GA,@grafana/alerting-squad,false,false,true -feedbackButton,experimental,@grafana/grafana-operator-experience-squad,false,false,false unifiedStorageSearchUI,experimental,@grafana/search-and-storage,false,false,false elasticsearchCrossClusterSearch,GA,@grafana/partner-datasources,false,false,false unifiedHistory,experimental,@grafana/grafana-search-navigate-organise,false,false,true diff --git a/pkg/services/featuremgmt/toggles_gen.go b/pkg/services/featuremgmt/toggles_gen.go index 9fb1c573406..f6c70624e8d 100644 --- a/pkg/services/featuremgmt/toggles_gen.go +++ b/pkg/services/featuremgmt/toggles_gen.go @@ -687,10 +687,6 @@ const ( // Enables simplified step mode in the notifications section FlagAlertingNotificationsStepMode = "alertingNotificationsStepMode" - // FlagFeedbackButton - // Enables a button to send feedback from the Grafana UI - FlagFeedbackButton = "feedbackButton" - // FlagUnifiedStorageSearchUI // Enable unified storage search UI FlagUnifiedStorageSearchUI = "unifiedStorageSearchUI" diff --git a/pkg/services/featuremgmt/toggles_gen.json b/pkg/services/featuremgmt/toggles_gen.json index daf3c48c40c..44ed33ad19c 100644 --- a/pkg/services/featuremgmt/toggles_gen.json +++ b/pkg/services/featuremgmt/toggles_gen.json @@ -1731,7 +1731,8 @@ "metadata": { "name": "feedbackButton", "resourceVersion": "1753448760331", - "creationTimestamp": "2024-12-02T17:08:15Z" + "creationTimestamp": "2024-12-02T17:08:15Z", + "deletionTimestamp": "2025-11-20T09:53:52Z" }, "spec": { "description": "Enables a button to send feedback from the Grafana UI", From 3c0d5745fe768369fb4ac9f07de652ad55f0f392 Mon Sep 17 00:00:00 2001 From: Charandas <542168+charandas@users.noreply.github.com> Date: Thu, 20 Nov 2025 02:23:36 -0800 Subject: [PATCH 06/15] chore: remove remaining references to singular namespace (#114208) --- pkg/apiserver/endpoints/filters/path_rewriter_test.go | 8 ++++---- .../apis/provisioning/resources/repository_test.go | 4 ++-- .../apiserver/endpoints/request/namespace_test.go | 2 +- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/pkg/apiserver/endpoints/filters/path_rewriter_test.go b/pkg/apiserver/endpoints/filters/path_rewriter_test.go index 2340c3ff1f8..d8d8278ccf7 100644 --- a/pkg/apiserver/endpoints/filters/path_rewriter_test.go +++ b/pkg/apiserver/endpoints/filters/path_rewriter_test.go @@ -28,20 +28,20 @@ func Test_WithPathRewriters(t *testing.T) { handler := WithPathRewriters(mockHandler, rewriters) t.Run("should rewrite path", func(t *testing.T) { - req, err := http.NewRequest("GET", "/apis/scope.grafana.app/namespaces/stack-1234/query/blah", nil) + req, err := http.NewRequest("GET", "/apis/scope.grafana.app/namespaces/stacks-1234/query/blah", nil) assert.NoError(t, err) rr := httptest.NewRecorder() handler.ServeHTTP(rr, req) assert.Equal(t, http.StatusOK, rr.Code) - assert.Equal(t, "/apis/scope.grafana.app/namespaces/stack-1234/query", rr.Body.String()) + assert.Equal(t, "/apis/scope.grafana.app/namespaces/stacks-1234/query", rr.Body.String()) }) t.Run("should ignore requests that don't match", func(t *testing.T) { - req, err := http.NewRequest("GET", "/apis/scope.grafana.app/namespaces/stack-1234/scopes/1", nil) + req, err := http.NewRequest("GET", "/apis/scope.grafana.app/namespaces/stacks-1234/scopes/1", nil) assert.NoError(t, err) rr := httptest.NewRecorder() handler.ServeHTTP(rr, req) assert.Equal(t, http.StatusOK, rr.Code) - assert.Equal(t, "/apis/scope.grafana.app/namespaces/stack-1234/scopes/1", rr.Body.String()) + assert.Equal(t, "/apis/scope.grafana.app/namespaces/stacks-1234/scopes/1", rr.Body.String()) }) } diff --git a/pkg/registry/apis/provisioning/resources/repository_test.go b/pkg/registry/apis/provisioning/resources/repository_test.go index 5240d9d2758..cf845ba7440 100644 --- a/pkg/registry/apis/provisioning/resources/repository_test.go +++ b/pkg/registry/apis/provisioning/resources/repository_test.go @@ -536,7 +536,7 @@ func TestCheckResourceOwnership(t *testing.T) { "name": "test-resource", "annotations": map[string]interface{}{ utils.AnnoKeyManagerKind: "terraform", - utils.AnnoKeyManagerIdentity: "tf-stack-1", + utils.AnnoKeyManagerIdentity: "tf-stacks-1", }, }, }, @@ -546,7 +546,7 @@ func TestCheckResourceOwnership(t *testing.T) { Identity: "repo-1", }, expectError: true, - expectedMessage: "resource 'test-resource' is managed by terraform 'tf-stack-1' and cannot be modified by repo 'repo-1'", + expectedMessage: "resource 'test-resource' is managed by terraform 'tf-stacks-1' and cannot be modified by repo 'repo-1'", }, } diff --git a/pkg/services/apiserver/endpoints/request/namespace_test.go b/pkg/services/apiserver/endpoints/request/namespace_test.go index 6c565d43e19..47c75fa2e77 100644 --- a/pkg/services/apiserver/endpoints/request/namespace_test.go +++ b/pkg/services/apiserver/endpoints/request/namespace_test.go @@ -26,7 +26,7 @@ func TestNamespaceMapper(t *testing.T) { orgId: 123, expected: "org-123", }, - // an invalid use-case, but just documenting that it's handled as stack-0 + // an invalid use-case, but just documenting that it's handled as stacks-0 // this currently prevents the need to have the Mapper return (mapped, err) instead of just mapped. // err checking is avoided for now to keep the usage fluent { From 6e9a33e712606dbf73fff2d2b86bfc7169af0c0f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ida=20=C5=A0tambuk?= Date: Thu, 20 Nov 2025 12:01:21 +0100 Subject: [PATCH 07/15] Dynamic Dashboards: Add more tracking (#114098) --- .../edit-pane/VizPanelEditableElement.tsx | 8 +++++- .../scene/PanelMenuBehavior.tsx | 9 +++++++ .../scene/UnconfiguredPanel.tsx | 2 ++ .../DashboardSceneSerializer.test.ts | 7 ++++- .../serialization/DashboardSceneSerializer.ts | 8 ++++++ .../dashboard-scene/utils/interactions.ts | 26 +++++++++++++++++-- .../dashboard-scene/utils/tracking.test.ts | 5 ++++ .../dashboard-scene/utils/tracking.ts | 11 +++++++- .../SaveDashboard/useDashboardSave.tsx | 8 +++++- .../app/features/dashboard/utils/tracking.ts | 5 +++- 10 files changed, 82 insertions(+), 7 deletions(-) diff --git a/public/app/features/dashboard-scene/edit-pane/VizPanelEditableElement.tsx b/public/app/features/dashboard-scene/edit-pane/VizPanelEditableElement.tsx index 200357fa881..39ed9beaa52 100644 --- a/public/app/features/dashboard-scene/edit-pane/VizPanelEditableElement.tsx +++ b/public/app/features/dashboard-scene/edit-pane/VizPanelEditableElement.tsx @@ -21,6 +21,7 @@ import { BulkActionElement } from '../scene/types/BulkActionElement'; import { isDashboardLayoutItem } from '../scene/types/DashboardLayoutItem'; import { EditableDashboardElement, EditableDashboardElementInfo } from '../scene/types/EditableDashboardElement'; import { dashboardSceneGraph } from '../utils/dashboardSceneGraph'; +import { DashboardInteractions } from '../utils/interactions'; import { getDashboardSceneFor, getPanelIdForVizPanel } from '../utils/utils'; import { MultiSelectedVizPanelsEditableElement } from './MultiSelectedVizPanelsEditableElement'; @@ -95,6 +96,7 @@ export class VizPanelEditableElement implements EditableDashboardElement, BulkAc public useEditPaneOptions = useEditPaneOptions.bind(this); public onDelete() { + DashboardInteractions.panelActionClicked('duplicate', getPanelIdForVizPanel(this.panel), 'edit_pane'); const layout = dashboardSceneGraph.getLayoutManagerFor(this.panel); layout.removePanel?.(this.panel); } @@ -116,11 +118,13 @@ export class VizPanelEditableElement implements EditableDashboardElement, BulkAc } public onDuplicate() { + DashboardInteractions.panelActionClicked('duplicate', getPanelIdForVizPanel(this.panel), 'edit_pane'); const layout = dashboardSceneGraph.getLayoutManagerFor(this.panel); layout.duplicatePanel?.(this.panel); } public onCopy() { + DashboardInteractions.panelActionClicked('copy', getPanelIdForVizPanel(this.panel), 'edit_pane'); const dashboard = getDashboardSceneFor(this.panel); dashboard.copyPanel(this.panel); } @@ -147,7 +151,9 @@ const OpenPanelEditViz = ({ panel }: OpenPanelEditVizProps) => { + + + )} + {openPane === 'outline' && ( + + togglePane('')} /> + + )} + {openPane === 'add' && ( + + togglePane('')} /> + + )} + + togglePane('add')} + /> + + togglePane('settings')} + /> + togglePane('outline')} + /> + + + + + + + + ); +}; + +export const VerticalTabs: StoryFn = (args) => { + const [openPane, setOpenPane] = useState('queries'); + + const togglePane = (pane: string) => { + setOpenPane(pane); + }; + + const containerStyle = css({ + flexGrow: 1, + height: '600px', + display: 'flex', + flexDirection: 'column', + position: 'relative', + overflow: 'hidden', + gap: '16px', + }); + + const vizWrapper = css({ + height: '30%', + display: 'flex', + }); + + const contextValue = useSidebar({ + position: args.position, + tabsMode: true, + edgeMargin: 0, + }); + + return ( + +
+
{renderBox('Visualization')}
+ + {openPane === 'queries' && ( + + + + )} + {openPane === 'transformations' && ( + + + + )} + + togglePane('queries')} + /> + togglePane('transformations')} + /> + + + +
+ + ); +}; + +function renderBox(label: string) { + return ( + + {label} + + ); +} + +export default meta; diff --git a/packages/grafana-ui/src/components/Sidebar/Sidebar.test.tsx b/packages/grafana-ui/src/components/Sidebar/Sidebar.test.tsx new file mode 100644 index 00000000000..187fbc90c4b --- /dev/null +++ b/packages/grafana-ui/src/components/Sidebar/Sidebar.test.tsx @@ -0,0 +1,51 @@ +import { render, screen } from '@testing-library/react'; +import React, { act } from 'react'; + +import { Sidebar, useSidebar } from './Sidebar'; + +describe('Sidebar', () => { + it('should render sidebar', async () => { + render(); + + act(() => screen.getByLabelText('Settings').click()); + + // Verify pane is open + expect(screen.getByTestId('sidebar-pane-header-title')).toBeInTheDocument(); + + act(() => screen.getByLabelText('Dock').click()); + + // Verify wrapper pushes content when docked + const wrapper = screen.getByTestId('sidebar-test-wrapper'); + expect(wrapper).toHaveStyle('padding-right: 352px'); + + // Close pane + act(() => screen.getByLabelText('Close').click()); + // Verify pane is closed + expect(screen.queryByTestId('sidebar-pane-header-title')).not.toBeInTheDocument(); + }); +}); + +function TestSetup() { + const [openPane, setOpenPane] = React.useState(''); + const contextValue = useSidebar({ + position: 'right', + hasOpenPane: openPane !== '', + }); + + return ( +
+ + {openPane === 'settings' && ( + + setOpenPane('')} /> + + )} + + setOpenPane('settings')} /> + + + + +
+ ); +} diff --git a/packages/grafana-ui/src/components/Sidebar/Sidebar.tsx b/packages/grafana-ui/src/components/Sidebar/Sidebar.tsx new file mode 100644 index 00000000000..2d9b407a1ad --- /dev/null +++ b/packages/grafana-ui/src/components/Sidebar/Sidebar.tsx @@ -0,0 +1,167 @@ +import { css, cx } from '@emotion/css'; +import { ReactNode, useContext } from 'react'; + +import { GrafanaTheme2 } from '@grafana/data'; +import { t } from '@grafana/i18n'; + +import { useStyles2, useTheme2 } from '../../themes/ThemeContext'; + +import { SidebarButton } from './SidebarButton'; +import { SidebarPaneHeader } from './SidebarPaneHeader'; +import { SidebarResizer } from './SidebarResizer'; +import { SIDE_BAR_WIDTH_ICON_ONLY, SIDE_BAR_WIDTH_WITH_TEXT, SidebarContext, SidebarContextValue } from './useSidebar'; + +export interface Props { + children?: ReactNode; + contextValue: SidebarContextValue; +} + +export function SidebarComp({ children, contextValue }: Props) { + const styles = useStyles2(getStyles); + const theme = useTheme2(); + const { isDocked, position, tabsMode, hasOpenPane, edgeMargin, bottomMargin } = contextValue; + + const className = cx({ + [styles.container]: true, + [styles.undockedPaneOpen]: hasOpenPane && !isDocked, + [styles.containerLeft]: position === 'left', + [styles.containerTabsMode]: tabsMode, + }); + + const style = { [position]: theme.spacing(edgeMargin), bottom: theme.spacing(bottomMargin) }; + + return ( + +
+ {!tabsMode && } + {children} +
+ + ); +} + +export interface SiderbarToolbarProps { + children?: ReactNode; +} + +export function SiderbarToolbar({ children }: SiderbarToolbarProps) { + const styles = useStyles2(getStyles); + const context = useContext(SidebarContext); + + if (!context) { + throw new Error('Sidebar.Toolbar must be used within a Sidebar component'); + } + + return ( +
+ {children} +
+ {context.hasOpenPane && ( + + )} +
+ ); +} + +export function SidebarDivider() { + const styles = useStyles2(getStyles); + + return
; +} + +export interface SidebarOpenPaneProps { + children?: ReactNode; +} + +export function SidebarOpenPane({ children }: SidebarOpenPaneProps) { + const styles = useStyles2(getStyles); + const context = useContext(SidebarContext); + + if (!context) { + throw new Error('Sidebar.OpenPane must be used within a Sidebar component'); + } + + const className = cx(styles.openPane, context.position === 'right' ? styles.openPaneRight : styles.openPaneLeft); + + return ( +
+ {children} +
+ ); +} + +export const getStyles = (theme: GrafanaTheme2) => { + return { + container: css({ + display: 'flex', + position: 'absolute', + flexDirection: 'row', + flex: '1 1 0', + border: `1px solid ${theme.colors.border.weak}`, + background: theme.colors.background.primary, + borderRadius: theme.shape.radius.default, + zIndex: theme.zIndex.navbarFixed, + bottom: 0, + top: 0, + right: 0, + }), + containerTabsMode: css({ + position: 'relative', + }), + containerLeft: css({ + right: 'unset', + flexDirection: 'row-reverse', + left: 0, + borderRadius: theme.shape.radius.default, + }), + undockedPaneOpen: css({ + boxShadow: theme.shadows.z3, + }), + toolbar: css({ + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + padding: theme.spacing(1, 0), + flexGrow: 0, + gap: theme.spacing(1), + overflow: 'hidden', + width: theme.spacing(SIDE_BAR_WIDTH_WITH_TEXT), + }), + toolbarIconsOnly: css({ + width: theme.spacing(SIDE_BAR_WIDTH_ICON_ONLY), + }), + divider: css({ + height: '1px', + background: theme.colors.border.weak, + width: '100%', + }), + flexGrow: css({ + flexGrow: 1, + }), + openPane: css({ + width: '280px', + flexGrow: 1, + paddingBottom: theme.spacing(2), + }), + openPaneRight: css({ + borderRight: `1px solid ${theme.colors.border.weak}`, + }), + openPaneLeft: css({ + borderLeft: `1px solid ${theme.colors.border.weak}`, + }), + }; +}; + +export const Sidebar = Object.assign(SidebarComp, { + Toolbar: SiderbarToolbar, + Button: SidebarButton, + OpenPane: SidebarOpenPane, + Divider: SidebarDivider, + PaneHeader: SidebarPaneHeader, +}); + +export { type SidebarPosition, type SidebarContextValue, useSidebar } from './useSidebar'; diff --git a/packages/grafana-ui/src/components/Sidebar/SidebarButton.tsx b/packages/grafana-ui/src/components/Sidebar/SidebarButton.tsx new file mode 100644 index 00000000000..f436d9630f6 --- /dev/null +++ b/packages/grafana-ui/src/components/Sidebar/SidebarButton.tsx @@ -0,0 +1,159 @@ +import { css, cx } from '@emotion/css'; +import { useContext } from 'react'; + +import { GrafanaTheme2, IconName, isIconName } from '@grafana/data'; + +import { useStyles2 } from '../../themes/ThemeContext'; +import { getFocusStyles, getMouseFocusStyles } from '../../themes/mixins'; +import { getActiveButtonStyles } from '../Button/Button'; +import { Icon } from '../Icon/Icon'; +import { Tooltip } from '../Tooltip/Tooltip'; + +import { SidebarContext } from './useSidebar'; + +export interface Props { + icon: IconName; + active?: boolean; + onClick?: () => void; + title: string; + tooltip?: string; +} + +export function SidebarButton({ icon, active, onClick, title, tooltip }: Props) { + const styles = useStyles2(getStyles); + const context = useContext(SidebarContext); + + if (!context) { + throw new Error('Sidebar.Button must be used within a Sidebar component'); + } + + const buttonClass = cx( + styles.button, + context.compact && styles.compact, + active && styles.active, + context.position === 'left' && styles.leftButton + ); + + return ( + + + + ); +} + +function renderIcon(icon: IconName | React.ReactNode, compact?: boolean) { + if (!icon) { + return null; + } + + if (isIconName(icon)) { + return ; + } + + return icon; +} + +const getStyles = (theme: GrafanaTheme2) => { + return { + button: css({ + label: 'toolbar-button', + position: 'relative', + display: 'flex', + flexDirection: 'column', + minHeight: theme.spacing(theme.components.height.md), + padding: theme.spacing(0, 1), + width: '100%', + overflow: 'hidden', + // borderRadius: theme.shape.radius.sm, + lineHeight: `${theme.components.height.md * theme.spacing.gridSize - 2}px`, + fontWeight: theme.typography.fontWeightMedium, + color: theme.colors.text.secondary, + background: 'transparent', + border: `none`, + + [theme.transitions.handleMotion('no-preference', 'reduce')]: { + transition: theme.transitions.create(['background-color', 'border-color', 'color'], { + duration: theme.transitions.duration.short, + }), + }, + + '&:focus, &:focus-visible': { + ...getFocusStyles(theme), + zIndex: 1, + }, + + '&:focus:not(:focus-visible)': getMouseFocusStyles(theme), + + '&[disabled], &:disabled': { + cursor: 'not-allowed', + opacity: theme.colors.action.disabledOpacity, + background: theme.colors.action.disabledBackground, + boxShadow: 'none', + + '&:hover': { + color: theme.colors.text.disabled, + background: theme.colors.action.disabledBackground, + boxShadow: 'none', + }, + }, + + '&:hover, &:focus-visible': { + color: theme.colors.text.primary, + background: theme.colors.action.hover, + }, + + '&:active': { + ...getActiveButtonStyles(theme.colors.secondary, 'solid'), + }, + }), + compact: css({ + height: theme.spacing(theme.components.height.md), + padding: theme.spacing(0, 1), + width: theme.spacing(5), + }), + active: css({ + color: theme.colors.text.primary, + background: theme.colors.action.selected, + '&::before': { + display: 'block', + content: '" "', + position: 'absolute', + right: 0, + top: 0, + height: '100%', + width: '2px', + borderRadius: theme.shape.radius.default, + backgroundImage: theme.colors.gradients.brandVertical, + }, + }), + buttonWrapper: css({ + display: 'flex', + flexDirection: 'column', + width: '100%', + whiteSpace: 'nowrap', + }), + iconWrapper: css({}), + title: css({ + fontSize: theme.typography.bodySmall.fontSize, + color: theme.colors.text.secondary, + textOverflow: 'ellipsis', + overflow: 'hidden', + textAlign: 'center', + whiteSpace: 'nowrap', + }), + titleActive: css({ + color: theme.colors.text.primary, + }), + leftButton: css({ + '&::before': { + right: 'unset', + left: 0, + top: 0, + height: '100%', + }, + }), + }; +}; diff --git a/packages/grafana-ui/src/components/Sidebar/SidebarPaneHeader.tsx b/packages/grafana-ui/src/components/Sidebar/SidebarPaneHeader.tsx new file mode 100644 index 00000000000..75393777879 --- /dev/null +++ b/packages/grafana-ui/src/components/Sidebar/SidebarPaneHeader.tsx @@ -0,0 +1,55 @@ +import { css } from '@emotion/css'; +import { ReactNode } from 'react'; + +import { GrafanaTheme2 } from '@grafana/data'; +import { t } from '@grafana/i18n'; + +import { useStyles2 } from '../../themes/ThemeContext'; +import { IconButton } from '../IconButton/IconButton'; +import { Text } from '../Text/Text'; + +export interface Props { + children?: ReactNode; + title: string; + onClose?: () => void; +} + +export function SidebarPaneHeader({ children, onClose, title }: Props) { + const styles = useStyles2(getStyles); + + return ( +
+ {onClose && ( + + )} + + {title} + +
+ {children} +
+ ); +} + +export const getStyles = (theme: GrafanaTheme2) => { + return { + wrapper: css({ + display: 'flex', + alignItems: 'center', + padding: theme.spacing(1.5), + height: theme.spacing(6), + gap: theme.spacing(1), + borderBottom: `1px solid ${theme.colors.border.weak}`, + }), + flexGrow: css({ + flexGrow: 1, + }), + }; +}; diff --git a/packages/grafana-ui/src/components/Sidebar/SidebarResizer.tsx b/packages/grafana-ui/src/components/Sidebar/SidebarResizer.tsx new file mode 100644 index 00000000000..7a243f00b54 --- /dev/null +++ b/packages/grafana-ui/src/components/Sidebar/SidebarResizer.tsx @@ -0,0 +1,93 @@ +import { css } from '@emotion/css'; +import { useCallback, useContext, useRef } from 'react'; + +import { GrafanaTheme2 } from '@grafana/data'; + +import { useStyles2 } from '../../themes/ThemeContext'; + +import { SidebarContext } from './useSidebar'; + +export function SidebarResizer() { + const styles = useStyles2(getStyles); + const context = useContext(SidebarContext); + const resizerRef = useRef(null); + const dragStart = useRef(null); + + if (!context) { + throw new Error('Sidebar.Resizer must be used within a Sidebar component'); + } + + const { onResize, position } = context; + + const onPointerDown = useCallback( + (e: React.PointerEvent) => { + if (resizerRef.current === null) { + return; + } + + resizerRef.current.setPointerCapture(e.pointerId); + dragStart.current = e.clientX; + }, + [resizerRef] + ); + + const onPointerMove = useCallback( + (e: React.PointerEvent) => { + if (dragStart.current === null) { + return; + } + + const diff = e.clientX - dragStart.current; + dragStart.current = e.clientX; + + onResize(position === 'right' ? -diff : diff); + }, + [dragStart, onResize, position] + ); + + const onPointerUp = useCallback( + (e: React.PointerEvent) => { + dragStart.current = null; + }, + [dragStart] + ); + + return ( +
+ ); +} + +const getStyles = (theme: GrafanaTheme2) => { + return { + right: css({ + position: 'absolute', + width: theme.spacing.gridSize, + left: -theme.spacing.gridSize, + top: theme.shape.radius.default, + bottom: theme.shape.radius.default, + cursor: 'col-resize', + zIndex: 1, + '&:hover': { + borderRight: `1px solid ${theme.colors.primary.border}`, + }, + }), + left: css({ + position: 'absolute', + width: theme.spacing.gridSize, + right: -theme.spacing.gridSize, + top: theme.shape.radius.default, + bottom: theme.shape.radius.default, + cursor: 'col-resize', + zIndex: 1, + '&:hover': { + borderLeft: `1px solid ${theme.colors.primary.border}`, + }, + }), + }; +}; diff --git a/packages/grafana-ui/src/components/Sidebar/useSidebar.tsx b/packages/grafana-ui/src/components/Sidebar/useSidebar.tsx new file mode 100644 index 00000000000..03d04b2f81a --- /dev/null +++ b/packages/grafana-ui/src/components/Sidebar/useSidebar.tsx @@ -0,0 +1,113 @@ +import { clamp } from 'lodash'; +import React, { useCallback } from 'react'; + +import { useTheme2 } from '../../themes/ThemeContext'; + +export type SidebarPosition = 'left' | 'right'; + +export interface SidebarContextValue { + isDocked: boolean; + position: SidebarPosition; + compact: boolean; + hasOpenPane?: boolean; + tabsMode?: boolean; + outerWrapperProps: React.HTMLAttributes; + paneWidth: number; + bottomMargin: number; + edgeMargin: number; + contentMargin: number; + onDockChange: () => void; + onResize: (diff: number) => void; +} + +export const SidebarContext: React.Context = React.createContext< + SidebarContextValue | undefined +>(undefined); + +export interface UseSideBarOptions { + hasOpenPane?: boolean; + position?: SidebarPosition; + tabsMode?: boolean; + compactDefault?: boolean; + /** defaults to 2 grid units (16px) */ + bottomMargin?: number; + /** defaults to 2 grid units (16px) */ + edgeMargin?: number; + /** defaults to 2 grid units (16px) */ + contentMargin?: number; +} + +export const SIDE_BAR_WIDTH_ICON_ONLY = 5; +export const SIDE_BAR_WIDTH_WITH_TEXT = 8; + +export function useSidebar({ + hasOpenPane, + position = 'right', + tabsMode, + compactDefault = true, + bottomMargin = 2, + edgeMargin = 2, + contentMargin = 2, +}: UseSideBarOptions): SidebarContextValue { + const theme = useTheme2(); + const [isDocked, setIsDocked] = React.useState(false); + const [paneWidth, setPaneWidth] = React.useState(280); + const [compact, setCompact] = React.useState(compactDefault); + // Used to accumulate drag distance to know when to change compact mode + const [_, setCompactDrag] = React.useState(0); + + const onDockChange = useCallback(() => setIsDocked((prev) => !prev), []); + + const prop = position === 'right' ? 'paddingRight' : 'paddingLeft'; + const toolbarWidth = + ((compact ? SIDE_BAR_WIDTH_ICON_ONLY : SIDE_BAR_WIDTH_WITH_TEXT) + edgeMargin + contentMargin) * + theme.spacing.gridSize; + + const outerWrapperProps = { + style: { + [prop]: isDocked && hasOpenPane ? paneWidth + toolbarWidth : toolbarWidth, + }, + }; + + const onResize = useCallback( + (diff: number) => { + setPaneWidth((prevWidth) => { + // If no pane is open we use the resize action to toggle compact mode (button text visibility) + if (!hasOpenPane) { + setCompactDrag((prevDrag) => { + const newDrag = prevDrag + diff; + if (newDrag < -20 && !compact) { + setCompact(true); + return 0; + } else if (newDrag > 20 && compact) { + setCompact(false); + return 0; + } + + return newDrag; + }); + + return prevWidth; + } + + return clamp(prevWidth + diff, 100, 500); + }); + }, + [hasOpenPane, compact] + ); + + return { + isDocked, + onDockChange, + onResize, + outerWrapperProps, + position, + compact, + hasOpenPane, + tabsMode, + paneWidth, + edgeMargin, + bottomMargin, + contentMargin, + }; +} diff --git a/packages/grafana-ui/src/index.ts b/packages/grafana-ui/src/index.ts index b46ce1d33bb..e567e3dd561 100644 --- a/packages/grafana-ui/src/index.ts +++ b/packages/grafana-ui/src/index.ts @@ -466,6 +466,7 @@ export { RunnerPlugin } from './slate-plugins/runner'; export { SelectionShortcutsPlugin } from './slate-plugins/selection_shortcuts'; export { SlatePrism, type Token } from './slate-plugins/slate-prism'; export { SuggestionsPlugin } from './slate-plugins/suggestions'; +export { Sidebar, useSidebar, type SidebarPosition, type SidebarContextValue } from './components/Sidebar/Sidebar'; // @deprecated import from @grafana/schema export { diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index 4492a771832..28512178dd7 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -8995,6 +8995,11 @@ "series-color-picker-popover": { "y-axis-usage": "Use right y-axis" }, + "sidebar": { + "close": "Close", + "dock": "Dock", + "undock": "Undock" + }, "slider": { "drag-handle-aria-label": "Use arrow keys to change the value" }, From e9116cd23c4fc8d83542e062033c4ada561bd534 Mon Sep 17 00:00:00 2001 From: Jay Clifford <45856600+Jayclifford345@users.noreply.github.com> Date: Thu, 20 Nov 2025 11:27:04 +0000 Subject: [PATCH 12/15] chore(testid): added missing testid to add datasource button (#114169) * added missing testid * added to pages.ts * added e2e to datasource button * fixed lint --- packages/grafana-e2e-selectors/src/selectors/pages.ts | 3 +++ .../datasources/components/DataSourceAddButton.tsx | 8 +++++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/grafana-e2e-selectors/src/selectors/pages.ts b/packages/grafana-e2e-selectors/src/selectors/pages.ts index 7716ccc1436..96d033d5b14 100644 --- a/packages/grafana-e2e-selectors/src/selectors/pages.ts +++ b/packages/grafana-e2e-selectors/src/selectors/pages.ts @@ -85,6 +85,9 @@ export const versionedPages = { dataSources: { [MIN_GRAFANA_VERSION]: (dataSourceName: string) => `Data source list item ${dataSourceName}`, }, + dataSourceAddButton: { + '12.4.0': 'data-testid data-source-add-button', + }, }, EditDataSource: { url: { diff --git a/public/app/features/datasources/components/DataSourceAddButton.tsx b/public/app/features/datasources/components/DataSourceAddButton.tsx index fa1da6b9953..f765188b50d 100644 --- a/public/app/features/datasources/components/DataSourceAddButton.tsx +++ b/public/app/features/datasources/components/DataSourceAddButton.tsx @@ -1,5 +1,6 @@ import { useCallback } from 'react'; +import { Pages } from '@grafana/e2e-selectors'; import { Trans } from '@grafana/i18n'; import { config } from '@grafana/runtime'; import { LinkButton } from '@grafana/ui'; @@ -16,7 +17,12 @@ export function DataSourceAddButton(): JSX.Element | null { }, []); return canCreateDataSource ? ( - + Add new data source ) : null; From b2f022fb5e2bab8a18f51a2bf219a4d8c394a0c2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ida=20=C5=A0tambuk?= Date: Thu, 20 Nov 2025 12:37:12 +0100 Subject: [PATCH 13/15] Dynamic Dashboards: Make outline open by default (#114146) --- e2e-playwright/dashboard-new-layouts/dashboard-outline.spec.ts | 2 -- .../dashboards-edit-custom-variables.spec.ts | 1 - e2e-playwright/dashboard-new-layouts/utils.ts | 1 - .../dashboard-scene/edit-pane/DashboardEditPaneRenderer.tsx | 2 +- .../features/dashboard-scene/scene/NavToolbarActions.test.tsx | 2 +- .../scene/new-toolbar/actions/EditDashboardSwitch.test.tsx | 2 +- .../new-toolbar/actions/MakeDashboardEditableButton.test.tsx | 2 +- public/app/features/dashboard-scene/utils/tracking.ts | 2 +- 8 files changed, 5 insertions(+), 9 deletions(-) diff --git a/e2e-playwright/dashboard-new-layouts/dashboard-outline.spec.ts b/e2e-playwright/dashboard-new-layouts/dashboard-outline.spec.ts index 49d55f8ca04..ef38379f006 100644 --- a/e2e-playwright/dashboard-new-layouts/dashboard-outline.spec.ts +++ b/e2e-playwright/dashboard-new-layouts/dashboard-outline.spec.ts @@ -22,8 +22,6 @@ test.describe( await dashboardPage.getByGrafanaSelector(selectors.components.NavToolbar.editDashboard.editButton).click(); - await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.section).click(); - // Should be able to click Variables item in outline to see add variable button await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.item('Variables')).click(); await expect( diff --git a/e2e-playwright/dashboard-new-layouts/dashboards-edit-custom-variables.spec.ts b/e2e-playwright/dashboard-new-layouts/dashboards-edit-custom-variables.spec.ts index ce5465c1e33..24c61e5e960 100644 --- a/e2e-playwright/dashboard-new-layouts/dashboards-edit-custom-variables.spec.ts +++ b/e2e-playwright/dashboard-new-layouts/dashboards-edit-custom-variables.spec.ts @@ -199,7 +199,6 @@ test.describe( .click(); // Open the modal editor in the side pane - await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.section).click(); await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.node('Variables')).click(); await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.item('foo')).click(); await openModal(dashboardPage, selectors); diff --git a/e2e-playwright/dashboard-new-layouts/utils.ts b/e2e-playwright/dashboard-new-layouts/utils.ts index c59f782b37a..da629ac8141 100644 --- a/e2e-playwright/dashboard-new-layouts/utils.ts +++ b/e2e-playwright/dashboard-new-layouts/utils.ts @@ -48,7 +48,6 @@ export const flows = { }, async newEditPaneVariableClick(dashboardPage: DashboardPage, selectors: E2ESelectorGroups) { await dashboardPage.getByGrafanaSelector(selectors.components.NavToolbar.editDashboard.editButton).click(); - await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.section).click(); await dashboardPage.getByGrafanaSelector(selectors.components.PanelEditor.Outline.item('Variables')).click(); await dashboardPage .getByGrafanaSelector(selectors.components.PanelEditor.ElementEditPane.addVariableButton) diff --git a/public/app/features/dashboard-scene/edit-pane/DashboardEditPaneRenderer.tsx b/public/app/features/dashboard-scene/edit-pane/DashboardEditPaneRenderer.tsx index c2e896fce83..9ca7fbab86e 100644 --- a/public/app/features/dashboard-scene/edit-pane/DashboardEditPaneRenderer.tsx +++ b/public/app/features/dashboard-scene/edit-pane/DashboardEditPaneRenderer.tsx @@ -35,7 +35,7 @@ export function DashboardEditPaneRenderer({ editPane, isEditPaneCollapsed, onTog const isNewElement = selection?.isNewElement() ?? false; const [outlineCollapsed, setOutlineCollapsed] = useLocalStorage( 'grafana.dashboard.edit-pane.outline.collapsed', - true + false ); const [outlinePaneSize = 0.4, setOutlinePaneSize] = useLocalStorage('grafana.dashboard.edit-pane.outline.size', 0.4); diff --git a/public/app/features/dashboard-scene/scene/NavToolbarActions.test.tsx b/public/app/features/dashboard-scene/scene/NavToolbarActions.test.tsx index e42df99d74a..e276bf80e46 100644 --- a/public/app/features/dashboard-scene/scene/NavToolbarActions.test.tsx +++ b/public/app/features/dashboard-scene/scene/NavToolbarActions.test.tsx @@ -162,7 +162,7 @@ describe('NavToolbarActions', () => { await userEvent.click(await screen.findByTestId(selectors.components.NavToolbar.editDashboard.editButton)); expect(DashboardInteractions.editButtonClicked).toHaveBeenCalledWith({ dashboardUid: 'dash-1', - outlineExpanded: false, + outlineExpanded: true, }); }); diff --git a/public/app/features/dashboard-scene/scene/new-toolbar/actions/EditDashboardSwitch.test.tsx b/public/app/features/dashboard-scene/scene/new-toolbar/actions/EditDashboardSwitch.test.tsx index 583a3da8818..e941c98cadb 100644 --- a/public/app/features/dashboard-scene/scene/new-toolbar/actions/EditDashboardSwitch.test.tsx +++ b/public/app/features/dashboard-scene/scene/new-toolbar/actions/EditDashboardSwitch.test.tsx @@ -58,7 +58,7 @@ describe('EditDashboardSwitch', () => { it('should call DashboardInteractions.editButtonClicked with outlineExpanded:true if grafana.dashboard.edit-pane.outline.collapsed is undefined', async () => { render(); await userEvent.click(await screen.findByTestId(selectors.components.NavToolbar.editDashboard.editButton)); - expect(DashboardInteractions.editButtonClicked).toHaveBeenCalledWith({ outlineExpanded: false }); + expect(DashboardInteractions.editButtonClicked).toHaveBeenCalledWith({ outlineExpanded: true }); }); it('should call DashboardInteractions.editButtonClicked with outlineExpanded:true if grafana.dashboard.edit-pane.outline.collapsed is false', async () => { diff --git a/public/app/features/dashboard-scene/scene/new-toolbar/actions/MakeDashboardEditableButton.test.tsx b/public/app/features/dashboard-scene/scene/new-toolbar/actions/MakeDashboardEditableButton.test.tsx index 05ce93adde1..87788a2b187 100644 --- a/public/app/features/dashboard-scene/scene/new-toolbar/actions/MakeDashboardEditableButton.test.tsx +++ b/public/app/features/dashboard-scene/scene/new-toolbar/actions/MakeDashboardEditableButton.test.tsx @@ -59,7 +59,7 @@ describe('MakeDashboardEditableButton', () => { it('should call DashboardInteractions.editButtonClicked with outlineExpanded:true if grafana.dashboard.edit-pane.outline.collapsed is undefined', async () => { render(); await userEvent.click(await screen.findByTestId(selectors.components.NavToolbar.editDashboard.editButton)); - expect(DashboardInteractions.editButtonClicked).toHaveBeenCalledWith({ outlineExpanded: false }); + expect(DashboardInteractions.editButtonClicked).toHaveBeenCalledWith({ outlineExpanded: true }); }); it('should call DashboardInteractions.editButtonClicked with outlineExpanded:true if grafana.dashboard.edit-pane.outline.collapsed is false', async () => { diff --git a/public/app/features/dashboard-scene/utils/tracking.ts b/public/app/features/dashboard-scene/utils/tracking.ts index fde95ce2ead..638f5bd781b 100644 --- a/public/app/features/dashboard-scene/utils/tracking.ts +++ b/public/app/features/dashboard-scene/utils/tracking.ts @@ -46,7 +46,7 @@ export const trackDeleteDashboardElement = (element: EditableDashboardElementInf export const trackDashboardSceneEditButtonClicked = (dashboardUid?: string) => { DashboardInteractions.editButtonClicked({ - outlineExpanded: !store.getBool('grafana.dashboard.edit-pane.outline.collapsed', true), + outlineExpanded: !store.getBool('grafana.dashboard.edit-pane.outline.collapsed', false), dashboardUid, }); }; From fbadbf385d597308636e5109a4f01702e196db12 Mon Sep 17 00:00:00 2001 From: Mihai Doarna Date: Thu, 20 Nov 2025 13:44:15 +0200 Subject: [PATCH 14/15] IAM: Add validation for new tokens with no expiration when token_expiration_day_limit is set (#114166) * do not create sa with no expiration when day limit is set * disable No expiration option if day limit is set * make i18n-extract * run prettier * address feedback --- pkg/services/serviceaccounts/api/token.go | 4 ++ .../serviceaccounts/api/token_test.go | 63 ++++++++++++++++--- .../components/CreateTokenModal.tsx | 51 +++++++++++---- public/locales/en-US/grafana.json | 3 + 4 files changed, 100 insertions(+), 21 deletions(-) diff --git a/pkg/services/serviceaccounts/api/token.go b/pkg/services/serviceaccounts/api/token.go index dcfb82b10f5..620d278ee1e 100644 --- a/pkg/services/serviceaccounts/api/token.go +++ b/pkg/services/serviceaccounts/api/token.go @@ -157,6 +157,10 @@ func (api *ServiceAccountsAPI) CreateToken(c *contextmodel.ReqContext) response. } if api.cfg.SATokenExpirationDayLimit > 0 { + if cmd.SecondsToLive == 0 { + return response.Error(http.StatusBadRequest, "Cannot create token with no expiration date when service_accounts.token_expiration_day_limit is set", nil) + } + dayExpireLimit := time.Now().Add(time.Duration(api.cfg.SATokenExpirationDayLimit) * time.Hour * 24).Truncate(24 * time.Hour) expirationDate := time.Now().Add(time.Duration(cmd.SecondsToLive) * time.Second).Truncate(24 * time.Hour) if expirationDate.After(dayExpireLimit) { diff --git a/pkg/services/serviceaccounts/api/token_test.go b/pkg/services/serviceaccounts/api/token_test.go index 087d786b723..e6218c10638 100644 --- a/pkg/services/serviceaccounts/api/token_test.go +++ b/pkg/services/serviceaccounts/api/token_test.go @@ -60,14 +60,15 @@ func TestServiceAccountsAPI_ListTokens(t *testing.T) { func TestServiceAccountsAPI_CreateToken(t *testing.T) { type TestCase struct { - desc string - id int64 - body string - permissions []accesscontrol.Permission - tokenTTL int64 - expectedErr error - expectedAPIKey *apikey.APIKey - expectedCode int + desc string + id int64 + body string + permissions []accesscontrol.Permission + tokenTTL int64 + tokenExpirationDayLimit int + expectedErr error + expectedAPIKey *apikey.APIKey + expectedCode int } tests := []TestCase{ @@ -105,12 +106,58 @@ func TestServiceAccountsAPI_CreateToken(t *testing.T) { permissions: []accesscontrol.Permission{{Action: serviceaccounts.ActionWrite, Scope: "serviceaccounts:id:1"}}, expectedCode: http.StatusBadRequest, }, + { + desc: "should not be able to create token for service account if max ttl is configured and exceeds the limit", + id: 1, + body: `{"name": "test", "secondsToLive": 11000}`, + tokenTTL: 10000, + permissions: []accesscontrol.Permission{{Action: serviceaccounts.ActionWrite, Scope: "serviceaccounts:id:1"}}, + expectedCode: http.StatusBadRequest, + }, + { + desc: "should be able to create token for service account if max ttl is configured and within the limit", + id: 1, + body: `{"name": "test", "secondsToLive": 5000}`, + tokenTTL: 10000, + permissions: []accesscontrol.Permission{{Action: serviceaccounts.ActionWrite, Scope: "serviceaccounts:id:1"}}, + expectedAPIKey: &apikey.APIKey{}, + expectedCode: http.StatusOK, + }, + { + desc: "should not be able to create token for service account if token expiration day limit is configured but not set in body", + id: 1, + body: `{"name": "test"}`, + tokenTTL: -1, + tokenExpirationDayLimit: 30, + permissions: []accesscontrol.Permission{{Action: serviceaccounts.ActionWrite, Scope: "serviceaccounts:id:1"}}, + expectedCode: http.StatusBadRequest, + }, + { + desc: "should not be able to create token for service account if token expiration day limit is configured and exceeds the limit", + id: 1, + body: `{"name": "test", "secondsToLive": 340000}`, // 340000 seconds is > 3 days + tokenTTL: -1, + tokenExpirationDayLimit: 3, + permissions: []accesscontrol.Permission{{Action: serviceaccounts.ActionWrite, Scope: "serviceaccounts:id:1"}}, + expectedCode: http.StatusBadRequest, + }, + { + desc: "should be able to create token for service account if token expiration day limit is configured and within the limit", + id: 1, + body: `{"name": "test", "secondsToLive": 250000}`, // 250000 seconds is almost 3 days + tokenTTL: -1, + tokenExpirationDayLimit: 3, + permissions: []accesscontrol.Permission{{Action: serviceaccounts.ActionWrite, Scope: "serviceaccounts:id:1"}}, + expectedAPIKey: &apikey.APIKey{}, + expectedCode: http.StatusOK, + }, } for _, tt := range tests { t.Run(tt.desc, func(t *testing.T) { server := setupTests(t, func(a *ServiceAccountsAPI) { a.cfg.ApiKeyMaxSecondsToLive = tt.tokenTTL + a.cfg.SATokenExpirationDayLimit = tt.tokenExpirationDayLimit a.service = &satests.FakeServiceAccountService{ ExpectedErr: tt.expectedErr, ExpectedAPIKey: tt.expectedAPIKey, diff --git a/public/app/features/serviceaccounts/components/CreateTokenModal.tsx b/public/app/features/serviceaccounts/components/CreateTokenModal.tsx index a0daa852b09..fdad92e254e 100644 --- a/public/app/features/serviceaccounts/components/CreateTokenModal.tsx +++ b/public/app/features/serviceaccounts/components/CreateTokenModal.tsx @@ -16,10 +16,8 @@ import { useStyles2, } from '@grafana/ui'; -const EXPIRATION_OPTIONS = [ - { label: 'No expiration', value: false }, - { label: 'Set expiration date', value: true }, -]; +const NO_EXPIRATION_OPTION = 'no-expiration'; +const CUSTOM_EXPIRATION_OPTION = 'custom-expiration'; export type ServiceAccountToken = { name: string; @@ -44,11 +42,15 @@ export const CreateTokenModal = ({ isOpen, token, serviceAccountLogin, onCreateT } else { maxExpirationDate.setDate(8640000000000000); } - const defaultExpirationDate = config.tokenExpirationDayLimit !== undefined && config.tokenExpirationDayLimit > 0; + + const isTokenExpirationDayLimitConfigured = + config.tokenExpirationDayLimit !== undefined && config.tokenExpirationDayLimit > 0; + + const defaultExpirationOption = isTokenExpirationDayLimitConfigured ? CUSTOM_EXPIRATION_OPTION : NO_EXPIRATION_OPTION; const [defaultTokenName, setDefaultTokenName] = useState(''); const [newTokenName, setNewTokenName] = useState(''); - const [isWithExpirationDate, setIsWithExpirationDate] = useState(defaultExpirationDate); + const [expirationOption, setExpirationOption] = useState(defaultExpirationOption); const [newTokenExpirationDate, setNewTokenExpirationDate] = useState(tomorrow); const [isExpirationDateValid, setIsExpirationDateValid] = useState(newTokenExpirationDate !== ''); const styles = useStyles2(getStyles); @@ -69,14 +71,15 @@ export const CreateTokenModal = ({ isOpen, token, serviceAccountLogin, onCreateT const onGenerateToken = () => { onCreateToken({ name: newTokenName || defaultTokenName, - secondsToLive: isWithExpirationDate ? getSecondsToLive(newTokenExpirationDate) : undefined, + secondsToLive: + expirationOption === CUSTOM_EXPIRATION_OPTION ? getSecondsToLive(newTokenExpirationDate) : undefined, }); }; const onCloseInternal = () => { setNewTokenName(''); setDefaultTokenName(''); - setIsWithExpirationDate(defaultExpirationDate); + setExpirationOption(defaultExpirationOption); setNewTokenExpirationDate(tomorrow); setIsExpirationDateValid(newTokenExpirationDate !== ''); onClose(); @@ -84,6 +87,24 @@ export const CreateTokenModal = ({ isOpen, token, serviceAccountLogin, onCreateT const modalTitle = !token ? 'Add service account token' : 'Service account token created'; + const getExpirationOptions = () => { + const noExpirationDescription = t( + 'serviceaccounts.create-token-modal.description-no-expiration-disabled', + 'Cannot create a token with no expiration date when token expiration day limit is configured' + ); + return [ + { + label: t('serviceaccounts.create-token-modal.label-no-expiration', 'No expiration'), + value: NO_EXPIRATION_OPTION, + description: isTokenExpirationDayLimitConfigured ? noExpirationDescription : undefined, + }, + { + label: t('serviceaccounts.create-token-modal.label-set-expiration-date', 'Set expiration date'), + value: CUSTOM_EXPIRATION_OPTION, + }, + ]; + }; + return ( {!token ? ( @@ -109,13 +130,14 @@ export const CreateTokenModal = ({ isOpen, token, serviceAccountLogin, onCreateT - {isWithExpirationDate && ( + {expirationOption === CUSTOM_EXPIRATION_OPTION && ( )} - diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index 28512178dd7..d29fe101bd6 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -12543,11 +12543,14 @@ "copy-clipboard": "Copy to clipboard", "copy-to-clipboard-and-close": "Copy to clipboard and close", "description-name-to-easily-identify-the-token": "Name to easily identify the token", + "description-no-expiration-disabled": "Cannot create a token with no expiration date when token expiration day limit is configured", "description-token": "Copy the token now as you will not be able to see it again. Losing a token requires creating a new one.", "generate-token": "Generate token", "label-display-name": "Display name", "label-expiration": "Expiration", "label-expiration-date": "Expiration date", + "label-no-expiration": "No expiration", + "label-set-expiration-date": "Set expiration date", "label-token": "Token" }, "get-actions-cell": { From 7f52586c68355d31a304b466e50d62263265c409 Mon Sep 17 00:00:00 2001 From: Priyansh Gupta <120119805+priyansh3006@users.noreply.github.com> Date: Thu, 20 Nov 2025 17:49:54 +0530 Subject: [PATCH 15/15] Prometheus: Hide 'Kick start your query' button for existing queries (#113980) * Prometheus: Hide 'Kick start your query' button for existing queries * refactor: simplify query check logic in Prometheus editor Remove unnecessary useMemo and buildVisualQueryFromString logic. Just check query.expr directly to determine button visibility. * fix: format code with prettier --- .../components/PromQueryEditorSelector.tsx | 22 ++++++++++--------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/packages/grafana-prometheus/src/querybuilder/components/PromQueryEditorSelector.tsx b/packages/grafana-prometheus/src/querybuilder/components/PromQueryEditorSelector.tsx index 8250bd91a68..dc0a5799259 100644 --- a/packages/grafana-prometheus/src/querybuilder/components/PromQueryEditorSelector.tsx +++ b/packages/grafana-prometheus/src/querybuilder/components/PromQueryEditorSelector.tsx @@ -118,16 +118,18 @@ export const PromQueryEditorSelector = memo((props) => { onAddQuery={onAddQuery} /> - + {!query.expr && ( + + )}