diff --git a/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md b/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md index 49e6c99098d..2bd6d4eef14 100644 --- a/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md +++ b/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md @@ -235,6 +235,7 @@ Experimental features might be changed or removed without prior notice. | `queryLibraryDashboards` | Enables Query Library feature in Dashboards | | `grafanaAdvisor` | Enables Advisor app | | `elasticsearchImprovedParsing` | Enables less memory intensive Elasticsearch result parsing | +| `datasourceConnectionsTab` | Shows defined connections for a data source in the plugins detail page | ## Development feature toggles diff --git a/packages/grafana-data/src/types/featureToggles.gen.ts b/packages/grafana-data/src/types/featureToggles.gen.ts index 3691d40e4df..ec63d6381f3 100644 --- a/packages/grafana-data/src/types/featureToggles.gen.ts +++ b/packages/grafana-data/src/types/featureToggles.gen.ts @@ -254,4 +254,5 @@ export interface FeatureToggles { queryLibraryDashboards?: boolean; grafanaAdvisor?: boolean; elasticsearchImprovedParsing?: boolean; + datasourceConnectionsTab?: boolean; } diff --git a/pkg/services/featuremgmt/registry.go b/pkg/services/featuremgmt/registry.go index ac80cb89c2c..81203ded268 100644 --- a/pkg/services/featuremgmt/registry.go +++ b/pkg/services/featuremgmt/registry.go @@ -1759,6 +1759,14 @@ var ( Stage: FeatureStageExperimental, Owner: awsDatasourcesSquad, }, + { + Name: "datasourceConnectionsTab", + Description: "Shows defined connections for a data source in the plugins detail page", + Stage: FeatureStageExperimental, + Owner: grafanaPluginsPlatformSquad, + RequiresDevMode: false, + FrontendOnly: true, + }, } ) diff --git a/pkg/services/featuremgmt/toggles_gen.csv b/pkg/services/featuremgmt/toggles_gen.csv index cc379d9878e..071c07a971e 100644 --- a/pkg/services/featuremgmt/toggles_gen.csv +++ b/pkg/services/featuremgmt/toggles_gen.csv @@ -235,3 +235,4 @@ ABTestFeatureToggleB,experimental,@grafana/sharing-squad,false,false,false queryLibraryDashboards,experimental,@grafana/grafana-frontend-platform,false,false,false grafanaAdvisor,experimental,@grafana/plugins-platform-backend,false,false,false elasticsearchImprovedParsing,experimental,@grafana/aws-datasources,false,false,false +datasourceConnectionsTab,experimental,@grafana/plugins-platform-backend,false,false,true diff --git a/pkg/services/featuremgmt/toggles_gen.go b/pkg/services/featuremgmt/toggles_gen.go index 02f3e7d062d..d7676dca557 100644 --- a/pkg/services/featuremgmt/toggles_gen.go +++ b/pkg/services/featuremgmt/toggles_gen.go @@ -950,4 +950,8 @@ const ( // FlagElasticsearchImprovedParsing // Enables less memory intensive Elasticsearch result parsing FlagElasticsearchImprovedParsing = "elasticsearchImprovedParsing" + + // FlagDatasourceConnectionsTab + // Shows defined connections for a data source in the plugins detail page + FlagDatasourceConnectionsTab = "datasourceConnectionsTab" ) diff --git a/pkg/services/featuremgmt/toggles_gen.json b/pkg/services/featuremgmt/toggles_gen.json index 6616e393d35..e310dd9a6a6 100644 --- a/pkg/services/featuremgmt/toggles_gen.json +++ b/pkg/services/featuremgmt/toggles_gen.json @@ -1155,6 +1155,22 @@ "requiresRestart": true } }, + { + "metadata": { + "name": "datasourceConnectionsTab", + "resourceVersion": "1737049826022", + "creationTimestamp": "2025-01-16T17:36:09Z", + "annotations": { + "grafana.app/updatedTimestamp": "2025-01-16 17:50:26.022636488 +0000 UTC" + } + }, + "spec": { + "description": "Shows defined connections for a data source in the plugins detail page", + "stage": "experimental", + "codeowner": "@grafana/plugins-platform-backend", + "frontend": true + } + }, { "metadata": { "name": "datasourceProxyDisableRBAC", diff --git a/public/app/features/plugins/admin/__mocks__/catalogPlugin.mock.ts b/public/app/features/plugins/admin/__mocks__/catalogPlugin.mock.ts index 251523db9ee..9ced4f20a84 100644 --- a/public/app/features/plugins/admin/__mocks__/catalogPlugin.mock.ts +++ b/public/app/features/plugins/admin/__mocks__/catalogPlugin.mock.ts @@ -339,3 +339,389 @@ export default { ], }, } as CatalogPlugin; + +export const datasourcePlugin = { + description: 'Use Amazon Redshift in Grafana', + downloads: 3019577, + id: 'grafana-redshift-datasource', + info: { + logos: { + small: 'https://grafana.com/api/plugins/grafana-redshift-datasource/versions/1.20.0/logos/small', + large: 'https://grafana.com/api/plugins/grafana-redshift-datasource/versions/1.20.0/logos/large', + }, + keywords: ['datasource', 'redshift', 'aws', 'amazon', 'cloud provider', 'database', 'data warehouse', 'sql'], + }, + name: 'Amazon Redshift', + orgName: 'Grafana Labs', + popularity: 0.2146, + publishedAt: '2021-11-24T08:37:47.000Z', + signature: 'valid', + signatureOrg: 'Grafana Labs', + signatureType: 'grafana', + updatedAt: '2025-01-10T20:23:27.000Z', + installedVersion: '1.20.0', + hasUpdate: false, + isInstalled: true, + isDisabled: false, + isCore: false, + isPublished: true, + isDeprecated: false, + isDev: false, + isEnterprise: false, + isManaged: false, + isPreinstalled: { + found: false, + withVersion: false, + }, + type: 'datasource', + accessControl: { + 'plugins.app:access': true, + 'plugins:write': true, + }, + angularDetected: false, + isFullyInstalled: true, + latestVersion: '1.20.0', + details: { + grafanaDependency: '>=8.0.0', + pluginDependencies: [], + links: [ + { + name: 'Website', + url: 'https://github.com/grafana/redshift-datasource', + }, + { + name: 'License', + url: 'https://github.com/redshift-datasource/blob/master/LICENSE', + }, + ], + readme: + '

Grafana 10 breaking change: update Redshift datasource plugin to >=1.8.3

\n

Grafana 10.0.0 was shipped with the new React 18 upgrade. Changes in batching of state updates in React 18 cause a bug in the query editor in Redshift versions <=1.8.2 If you’re using Grafana@>=10.0.0, please update your plugin to version 1.8.3 or higher in your Grafana instance management console.

\n

Redshift data source for Grafana

\n

The Redshift data source plugin allows you to query and visualize Redshift data metrics from within Grafana.

\n

This topic explains options, variables, querying, and other options specific to this data source. Refer to Add a data source for instructions on how to add a data source to Grafana.

\n

Configure the data source in Grafana

\n

To access data source settings, hover your mouse over the Configuration (gear) icon, then click Data Sources, and then click the Amazon Redshift data source.

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
NameDescription
NameThe data source name. This is how you refer to the data source in panels and queries.
DefaultDefault data source means that it will be pre-selected for new panels.
Authentication ProviderSpecify the provider to get credentials.
Access Key IDIf Access & secret key is selected, specify the Access Key of the security credentials to use.
Secret Access KeyIf Access & secret key is selected, specify the Secret Key of the security credentials to use.
Credentials Profile NameSpecify the name of the profile to use (if you use ~/.aws/credentials file), leave blank for default.
Assume Role Arn (optional)Specify the ARN of the role to assume.
External ID (optional)If you are assuming a role in another account, that has been created with an external ID, specify the external ID here.
Endpoint (optional)Optionally, specify a custom endpoint for the service.
Default RegionRegion in which the cluster is deployed.
AWS Secrets ManagerTo authenticate with Amazon Redshift using AWS Secrets Manager.
Temporary credentialsTo authenticate with Amazon Redshift using temporary database credentials.
ServerlessTo use a Redshift Serverless workgroup.
Cluster IdentifierRedshift Provisioned Cluster to use (automatically set if using AWS Secrets Manager).
WorkgroupRedshift Serverless Workgroup to use.
Managed SecretWhen using AWS Secrets Manager, select the secret containing the credentials to access the database. Note that Provisioned and Serverless stores credentials in a different format. Refer to Storing database credentials in AWS Secrets Manager for instructions.
Database UserUser of the database. Automatically set if using AWS Secrets Manager.
DatabaseName of the database within the cluster or workgroup.
Send events to Amazon EventBridgeTo send Data API events to Amazon EventBridge for monitoring purpose.
\n

Authentication

\n

For authentication options and configuration details, see AWS authentication topic.

\n

IAM policies

\n

Grafana needs permissions granted via IAM to be able to read Redshift metrics. You can attach these permissions to IAM roles and utilize Grafana's built-in support for assuming roles. Note that you will need to configure the required policy before adding the data source to Grafana. You can check some predefined policies by AWS here.

\n

Here is a minimal policy example:

\n
{\n  "Version": "2012-10-17",\n  "Statement": [\n    {\n      "Sid": "AllowReadingMetricsFromRedshift",\n      "Effect": "Allow",\n      "Action": [\n        "redshift-data:ListTables",\n        "redshift-data:DescribeTable",\n        "redshift-data:GetStatementResult",\n        "redshift-data:DescribeStatement",\n        "redshift-data:ListStatements",\n        "redshift-data:ListSchemas",\n        "redshift-data:ExecuteStatement",\n        "redshift-data:CancelStatement",\n        "redshift:GetClusterCredentials",\n        "redshift:DescribeClusters",\n        "redshift-serverless:ListWorkgroups",\n        "redshift-serverless:GetCredentials",\n        "secretsmanager:ListSecrets"\n      ],\n      "Resource": "*"\n    },\n    {\n      "Sid": "AllowReadingRedshiftQuerySecrets",\n      "Effect": "Allow",\n      "Action": ["secretsmanager:GetSecretValue"],\n      "Resource": "*",\n      "Condition": {\n        "Null": {\n          "secretsmanager:ResourceTag/RedshiftQueryOwner": "false"\n        }\n      }\n    }\n  ]\n}\n
\n

Query Redshift data

\n

The provided query editor is a standard SQL query editor. Grafana includes some macros to help with writing more complex timeseries queries.

\n

Macros

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
MacroDescriptionOutput example
$__timeEpoch(column)$__timeEpoch will be replaced by an expression to convert to a UNIX timestamp and rename the column to timeUNIX_TIMESTAMP(dateColumn) as "time"
$__timeFilter(column)$__timeFilter creates a conditional that filters the data (using column) based on the time range of the paneltime BETWEEN '2017-07-18T11:15:52Z' AND '2017-07-18T11:15:52Z'
$__timeFrom()$__timeFrom outputs the current starting time of the range of the panel with quotes'2017-07-18T11:15:52Z'
$__timeTo()$__timeTo outputs the current ending time of the range of the panel with quotes'2017-07-18T11:15:52Z'
$__timeGroup(column, '1m')$__timeGroup groups timestamps so that there is only 1 point for every period on the graphfloor(extract(epoch from time)/60)*60 AS "time"
$__schema$__schema uses the selected schemapublic
$__table$__table outputs a table from the given $__schema (it uses the public schema by default)sales
$__column$__column outputs a column from the current $__tabledate
$__unixEpochFilter(column)$__unixEpochFilter be replaced by a time range filter using the specified column name with times represented as Unix timestampcolumn >= 1624406400 AND column <= 1624410000
$__unixEpochGroup(column)$__unixEpochGroup is the same as $__timeGroup but for times stored as Unix timestampfloor(time/60)*60 AS "time"
\n

Table Visualization

\n

Most queries in Redshift will be best represented by a table visualization. Any query will display data in a table. If it can be queried, then it can be put in a table.

\n

This example returns results for a table visualization:

\n
SELECT {column_1}, {column_2} FROM {table};\n
\n

Timeseries / Graph visualizations

\n

For timeseries / graph visualizations, there are a few requirements:

\n\n

To make a more reasonable graph, be sure to use the $__timeFilter and $__timeGroup macros.

\n

Example timeseries query:

\n
SELECT\n  avg(execution_time) AS average_execution_time,\n  $__timeGroup(start_time, 'hour'),\n  query_type\nFROM\n  account_usage.query_history\nWHERE\n  $__timeFilter(start_time)\ngroup by\n  query_type,start_time\norder by\n  start_time,query_type ASC;\n
\n
Fill value
\n

When data frames are formatted as time series, you can choose how missing values should be filled. This in turn affects how they are rendered: with connected or disconnected values. To configure this value, change the "Fill Value" in the query editor.

\n

Inspecting the query

\n

Because Grafana supports macros that Redshift does not, the fully rendered query, which can be copy/pasted directly into Redshift, is visible in the Query Inspector. To view the full interpolated query, click the Query Inspector button, and the full query will be visible under the "Query" tab.

\n

Templates and variables

\n

To add a new Redshift query variable, refer to Add a query variable. Use your Redshift data source as your data source for the following available queries:

\n

Any value queried from a Redshift table can be used as a variable. Be sure to avoid selecting too many values, as this can cause performance issues.

\n

To display a custom display name for a variable, you can use a query such as SELECT hostname AS text, id AS value FROM MyTable. In this case the variable value field must be a string type or cast to a string type.

\n

After creating a variable, you can use it in your Redshift queries by using Variable syntax. For more information about variables, refer to Templates and variables.

\n

Annotations

\n

Annotations allow you to overlay rich event information on top of graphs. You can add annotations by clicking on panels or by adding annotation queries via the Dashboard menu / Annotations view.

\n

Example query to automatically add annotations:

\n
SELECT\n  time as time,\n  environment as tags,\n  humidity as text\nFROM\n  $__table\nWHERE\n  $__timeFilter(time) and humidity > 95\n
\n

The following table represents the values of the columns taken into account to render annotations:

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
NameDescription
timeThe name of the date/time field. Could be a column with a native SQL date/time data type or epoch value.
timeendOptional name of the end date/time field. Could be a column with a native SQL date/time data type or epoch value. (Grafana v6.6+)
textEvent description field.
tagsOptional field name to use for event tags as a comma separated string.
\n

Provision Redshift data source

\n

You can configure the Redshift data source using configuration files with Grafana's provisioning system. For more information, refer to the provisioning docs page.

\n

Here are some provisioning examples.

\n

Using AWS SDK (default)

\n
apiVersion: 1\ndatasources:\n  - name: Redshift\n    type: redshift\n    jsonData:\n      authType: default\n      defaultRegion: eu-west-2\n
\n

Using credentials' profile name (non-default)

\n
apiVersion: 1\n\ndatasources:\n  - name: Redshift\n    type: redshift\n    jsonData:\n      authType: credentials\n      defaultRegion: eu-west-2\n      profile: secondary\n
\n

Using accessKey and secretKey

\n
apiVersion: 1\n\ndatasources:\n  - name: Redshift\n    type: grafana-redshift-datasource\n    jsonData:\n      authType: keys\n      defaultRegion: eu-west-2\n    secureJsonData:\n      accessKey: '<your access key>'\n      secretKey: '<your secret key>'\n
\n

Using AWS SDK Default and ARN of IAM Role to Assume

\n
apiVersion: 1\ndatasources:\n  - name: Redshift\n    type: grafana-redshift-datasource\n    jsonData:\n      authType: default\n      assumeRoleArn: arn:aws:iam::123456789012:root\n      defaultRegion: eu-west-2\n
\n

Pre-configured Redshift dashboards

\n

Redshift data source ships with a pre-configured dashboard for some advanced monitoring parameters. This curated dashboard is based on similar dashboards in the AWS Labs repository for Redshift. Check it out for more details.

\n

Follow these instructions for importing a dashboard in Grafana.

\n

Imported dashboards can be found in Configuration > Data Sources > select your Redshift data source > select the Dashboards tab to see available pre-made dashboards.

\n

Get the most out of the plugin

\n\n

Async Query Data Support

\n

Async Query Data support enables an asynchronous query handling flow. With Async Query Data support enabled, queries will be handled over multiple requests (starting, checking its status, and fetching the results) instead of having a query be started and resolved over a single request. This is useful for queries that can potentially run for a long time and timeout. You'll need to ensure the IAM policy used by Grafana allows the following actions redshift-data:ListStatements and redshift-data:CancelStatement.

\n

Async query data support is enabled by default in all Redshift datasources.

\n

Async Query Caching

\n

To enable query caching for async queries, you need to be on Grafana version 10.1 or above, and to set the feature toggles useCachingService and awsAsyncQueryCaching to true. You'll also need to configure query caching for the specific Redshift datasource.

\n', + versions: [ + { + version: '1.20.0', + createdAt: '2025-01-10T20:23:26.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.19.1', + createdAt: '2024-12-06T10:39:33.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.19.0', + createdAt: '2024-10-21T20:15:45.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.18.0', + createdAt: '2024-08-20T13:12:42.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.17.0', + createdAt: '2024-08-12T10:48:02.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.16.0', + createdAt: '2024-07-05T08:51:15.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.15.2', + createdAt: '2024-06-26T18:30:12.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.15.1', + createdAt: '2024-06-10T19:12:04.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.15.0', + createdAt: '2024-05-31T16:38:26.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.14.0', + createdAt: '2024-03-19T16:14:51.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.13.3', + createdAt: '2024-02-16T19:14:40.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.13.2', + createdAt: '2024-02-12T10:45:23.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.13.1', + createdAt: '2023-11-24T04:48:20.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.13.0', + createdAt: '2023-10-31T14:50:23.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.12.2', + createdAt: '2023-10-05T13:53:53.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.12.1', + createdAt: '2023-08-30T14:43:16.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.12.0', + createdAt: '2023-08-23T15:49:16.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.11.1', + createdAt: '2023-08-15T13:14:00.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.11.0', + createdAt: '2023-08-08T10:20:47.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.10.0', + createdAt: '2023-07-19T20:26:45.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.9.0', + createdAt: '2023-06-20T19:24:48.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.8.4', + createdAt: '2023-05-15T08:29:05.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.8.3', + createdAt: '2023-05-10T10:00:53.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.8.2', + createdAt: '2023-05-05T19:24:43.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.8.1', + createdAt: '2023-04-25T15:32:50.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.8.0', + createdAt: '2023-04-20T08:14:30.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.7.0', + createdAt: '2023-03-02T21:22:15.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.6.0', + createdAt: '2023-02-01T12:17:23.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.5.0', + createdAt: '2023-01-25T17:07:23.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.4.1', + createdAt: '2022-12-05T21:55:26.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.4.0', + createdAt: '2022-12-02T16:57:08.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.3.3', + createdAt: '2022-11-30T20:49:43.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.3.2', + createdAt: '2022-11-04T20:07:33.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.3.1', + createdAt: '2022-10-24T07:51:39.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.3.0', + createdAt: '2022-10-04T09:01:57.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.2.0', + createdAt: '2022-09-22T07:36:27.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.1.0', + createdAt: '2022-08-24T09:33:58.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.7', + createdAt: '2022-07-21T19:50:20.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.6', + createdAt: '2022-07-12T09:08:36.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.5', + createdAt: '2022-04-01T10:02:36.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.4', + createdAt: '2022-03-24T09:53:08.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.3', + createdAt: '2022-02-22T15:31:54.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.2', + createdAt: '2022-01-25T12:40:17.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.1', + createdAt: '2021-12-01T16:55:29.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '1.0.0', + createdAt: '2021-11-30T09:16:07.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + { + version: '0.4.1', + createdAt: '2021-11-24T08:43:33.000Z', + isCompatible: true, + grafanaDependency: '>=8.0.0', + angularDetected: false, + }, + ], + statusContext: '', + changelog: + '

Changelog

\n

1.20.0

\n\n

1.19.1

\n\n

1.19.0

\n\n

1.18.0

\n\n

1.17.0

\n\n

1.16.0

\n\n

1.15.2

\n\n

1.15.1

\n\n

1.15.0

\n\n

New Contributors

\n\n

1.14.0

\n\n

1.13.3

\n\n

1.13.2

\n\n

1.13.1

\n\n

Full Changelog: https://github.com/grafana/redshift-datasource/compare/v1.13.0...v1.13.1

\n

1.13.0

\n\n

1.12.2

\n\n

1.12.1

\n\n

1.12.0

\n\n

1.11.1

\n\n

1.11.0

\n\n

1.10.0

\n\n

1.9.0

\n\n

1.8.4

\n\n

1.8.3

\n\n

1.8.2

\n\n

1.8.1

\n\n

1.8.0

\n\n

1.7.0

\n\n

1.6.0

\n\n

1.5.0

\n\n

1.4.1

\n\n

1.4.0

\n\n

1.3.3

\n\n

1.3.2

\n\n

1.3.1

\n\n

1.3.0

\n\n

1.2.0

\n\n

1.1.0

\n\n

1.0.7

\n\n

1.0.6

\n

What\'s Changed

\n\n

Full Changelog: https://github.com/grafana/redshift-datasource/compare/v1.0.5...v1.0.6

\n

1.0.5

\n\n

1.0.4

\n\n

1.0.3

\n

Fixes bugs for Endpoint and Assume Role settings.

\n

1.0.2

\n

Fixes a bug preventing from getting null values in a query.

\n

1.0.1

\n

Fixes a bug preventing from creating several data sources of the plugin in the same instance.

\n

1.0.0

\n

Initial release.

\n

0.4.1

\n

Improved curated dashboard.

\n

0.4.0

\n

Allow to authenticate using AWS Secret Manager. More bug fixes.

\n

0.3.0

\n

Third preview release. Includes curated dashboard.

\n

0.2.0

\n

Second release.

\n

0.1.0

\n

Initial release.

\n', + }, +} as CatalogPlugin; diff --git a/public/app/features/plugins/admin/components/ConnectionsTab.test.tsx b/public/app/features/plugins/admin/components/ConnectionsTab.test.tsx new file mode 100644 index 00000000000..2aa6f6510db --- /dev/null +++ b/public/app/features/plugins/admin/components/ConnectionsTab.test.tsx @@ -0,0 +1,127 @@ +import { screen } from '@testing-library/react'; +import { render } from 'test/test-utils'; + +import { DataSourceSettings } from '@grafana/data'; +import { config } from '@grafana/runtime'; +import { ContextSrv, setContextSrv } from 'app/core/services/context_srv'; +import { getMockDataSources } from 'app/features/datasources/__mocks__'; +import { AccessControlAction } from 'app/types'; + +import { datasourcePlugin } from '../__mocks__/catalogPlugin.mock'; + +import ConnectionsTab, { ConnectionsList } from './ConnectionsTab'; + +jest.mock('app/features/datasources/state', () => ({ + ...jest.requireActual('app/features/datasources/state'), + useLoadDataSource: jest.fn().mockReturnValue({ isLoading: false }), + getDataSources: jest.fn(() => 'getDataSources mock implementation'), +})); + +const setupContextSrv = () => { + const testContextSrv = new ContextSrv(); + testContextSrv.user.permissions = { + [AccessControlAction.DataSourcesCreate]: true, + [AccessControlAction.DataSourcesWrite]: true, + [AccessControlAction.DataSourcesExplore]: true, + }; + + setContextSrv(testContextSrv); +}; + +describe('', () => { + const oldExporeEnabled = config.exploreEnabled; + const olddatasourceConnectionsTab = config.featureToggles.datasourceConnectionsTab; + config.exploreEnabled = true; + config.featureToggles.datasourceConnectionsTab = true; + afterEach(() => { + jest.clearAllMocks(); + }); + + afterAll(() => { + config.exploreEnabled = oldExporeEnabled; + config.featureToggles.datasourceConnectionsTab = olddatasourceConnectionsTab; + }); + + it('should onnly render list of datasources with type=plugin.id', async () => { + setupContextSrv(); + const mockedConnections = getMockDataSources(3, { type: datasourcePlugin.id }); + mockedConnections[2].type = 'other-plugin-id'; + jest.requireMock('app/features/datasources/state').getDataSources.mockReturnValue(mockedConnections); + + render(); + + expect(await screen.findAllByRole('listitem')).toHaveLength(2); + expect(await screen.findAllByRole('heading')).toHaveLength(2); + expect(await screen.findByRole('link', { name: /Connections - Data sources/i })).toBeVisible(); + expect(await screen.findAllByRole('link', { name: /Build a dashboard/i })).toHaveLength(2); + expect(await screen.findAllByRole('link', { name: 'Explore' })).toHaveLength(2); + }); + + it('should render add new datasource button when no datasources are defined', async () => { + setupContextSrv(); + jest.requireMock('app/features/datasources/state').getDataSources.mockReturnValue(getMockDataSources(1)); + render(); + + expect(screen.getByText('Add new data source')).toBeVisible(); + expect(screen.getByText(`No data sources defined`)).toBeVisible(); + }); + + describe('', () => { + it('should render list of datasources', async () => { + const dss = getMockDataSources(2, { type: datasourcePlugin.id }); + render( + + ); + + expect(await screen.findAllByRole('listitem')).toHaveLength(2); + expect(await screen.findAllByRole('heading')).toHaveLength(2); + expect(await screen.findByRole('link', { name: /Connections - Data sources/i })).toBeVisible(); + expect(await screen.findAllByRole('link', { name: /Build a dashboard/i })).toHaveLength(2); + expect(await screen.findAllByRole('link', { name: 'Explore' })).toHaveLength(2); + }); + + it('should not render Explore button when user has no access', async () => { + const dss = getMockDataSources(2, { type: datasourcePlugin.id }); + render( + + ); + + expect(await screen.findAllByRole('listitem')).toHaveLength(2); + expect(await screen.findAllByRole('heading')).toHaveLength(2); + expect(await screen.findByRole('link', { name: /Connections - Data sources/i })).toBeVisible(); + expect(await screen.findAllByRole('link', { name: /Build a dashboard/i })).toHaveLength(2); + expect(screen.queryAllByRole('link', { name: 'Explore' })).toHaveLength(0); + }); + + it('should render add new datasource button when no datasources are defined', async () => { + const dss = [] as DataSourceSettings[]; + render( + + ); + + expect(screen.getByText('Add new data source')).toBeVisible(); + expect(screen.getByText(`No data sources defined`)).toBeVisible(); + }); + }); +}); diff --git a/public/app/features/plugins/admin/components/ConnectionsTab.tsx b/public/app/features/plugins/admin/components/ConnectionsTab.tsx new file mode 100644 index 00000000000..d4896232277 --- /dev/null +++ b/public/app/features/plugins/admin/components/ConnectionsTab.tsx @@ -0,0 +1,107 @@ +import { css } from '@emotion/css'; + +import { GrafanaTheme2 } from '@grafana/data'; +import { EmptyState, Stack, TextLink, useStyles2 } from '@grafana/ui'; +import { t, Trans } from 'app/core/internationalization'; +import { contextSrv } from 'app/core/services/context_srv'; +import { ViewProps } from 'app/features/datasources/components/DataSourcesList'; +import { DataSourcesListCard } from 'app/features/datasources/components/DataSourcesListCard'; +import { getDataSources, useLoadDataSources } from 'app/features/datasources/state'; +import { AccessControlAction, useSelector } from 'app/types'; + +import { CatalogPlugin } from '../types'; + +import { GetStartedWithDataSource } from './GetStartedWithPlugin/GetStartedWithDataSource'; + +interface Props { + plugin: CatalogPlugin; +} + +export default function ConnectionsTab({ plugin }: Props) { + const { isLoading } = useLoadDataSources(); + + const allDataSources = useSelector((state) => getDataSources(state.dataSources)); + const dataSources = allDataSources.filter((ds) => ds.type === plugin.id); + const hasWriteRights = contextSrv.hasPermission(AccessControlAction.DataSourcesWrite); + const hasExploreRights = contextSrv.hasAccessToExplore(); + + return ( + + ); +} + +type ListProps = Omit & { + plugin: CatalogPlugin; +}; + +export function ConnectionsList({ + dataSources, + dataSourcesCount, + isLoading, + hasWriteRights, + hasExploreRights, + plugin, +}: ListProps) { + const styles = useStyles2(getStyles); + + if (!isLoading && dataSourcesCount === 0) { + return ( + } + message={t('data-source-list.empty-state.title', 'No data sources defined')} + /> + ); + } + + const getDataSourcesList = () => { + if (isLoading) { + return new Array(5) + .fill(null) + .map((_, index) => ); + } + + return dataSources.map((dataSource) => ( +
  • + +
    • + )); + }; + + return ( + + + + The data source connections below are all {'{{pluginName}}'}. You can find all of your data source connections + of all types in{' '} + + Connections -{' '} + Data sources. + + + +
      {getDataSourcesList()}
    +     + ); +} + +const getStyles = (theme: GrafanaTheme2) => { + return { + list: css({ + listStyle: 'none', + display: 'grid', + // gap: '8px', Add back when legacy support for old Card interface is dropped + }), + }; +}; diff --git a/public/app/features/plugins/admin/components/PluginDetailsBody.test.tsx b/public/app/features/plugins/admin/components/PluginDetailsBody.test.tsx index 39770882e47..cceb1058832 100644 --- a/public/app/features/plugins/admin/components/PluginDetailsBody.test.tsx +++ b/public/app/features/plugins/admin/components/PluginDetailsBody.test.tsx @@ -99,4 +99,22 @@ describe('PluginDetailsBody', () => { }); }); }); + + it('should render data source connections tab content for installed data source plugin', async () => { + const plugin = getCatalogPluginMock({ type: PluginType.datasource }); + config.featureToggles.datasourceConnectionsTab = true; + await act(async () => { + renderWithStore( + + ); + }); + + expect(screen.getByText('No data sources defined')).toBeVisible(); + }); }); diff --git a/public/app/features/plugins/admin/components/PluginDetailsBody.tsx b/public/app/features/plugins/admin/components/PluginDetailsBody.tsx index d45024f59b7..6a1c3259321 100644 --- a/public/app/features/plugins/admin/components/PluginDetailsBody.tsx +++ b/public/app/features/plugins/admin/components/PluginDetailsBody.tsx @@ -1,7 +1,7 @@ import { css } from '@emotion/css'; import { useMemo } from 'react'; -import { AppPlugin, GrafanaTheme2, PluginContextProvider, UrlQueryMap } from '@grafana/data'; +import { AppPlugin, GrafanaTheme2, PluginContextProvider, UrlQueryMap, PluginType } from '@grafana/data'; import { config } from '@grafana/runtime'; import { PageInfoItem } from '@grafana/runtime/src/components/PluginPage'; import { CellProps, Column, InteractiveTable, Stack, useStyles2 } from '@grafana/ui'; @@ -14,6 +14,7 @@ import { usePluginConfig } from '../hooks/usePluginConfig'; import { CatalogPlugin, Permission, PluginTabIds } from '../types'; import { AppConfigCtrlWrapper } from './AppConfigWrapper'; +import Connections from './ConnectionsTab'; import { PluginDashboards } from './PluginDashboards'; import { PluginUsage } from './PluginUsage'; @@ -30,7 +31,6 @@ type Cell = CellProps> = useMemo( () => [ { @@ -91,6 +91,18 @@ export function PluginDetailsBody({ plugin, queryParams, pageId, info, showDetai ); } + if ( + config.featureToggles.datasourceConnectionsTab && + pageId === PluginTabIds.DATASOURCE_CONNECTIONS && + plugin.type === PluginType.datasource + ) { + return ( +
    + +
    + ); + } + // Permissions will be returned in the iam field for installed plugins and in the details.iam field when fetching details from gcom const permissions = plugin.iam?.permissions || plugin.details?.iam?.permissions; diff --git a/public/app/features/plugins/admin/components/PluginDetailsPage.test.tsx b/public/app/features/plugins/admin/components/PluginDetailsPage.test.tsx index c256b7f412a..4f1bde85393 100644 --- a/public/app/features/plugins/admin/components/PluginDetailsPage.test.tsx +++ b/public/app/features/plugins/admin/components/PluginDetailsPage.test.tsx @@ -76,7 +76,12 @@ jest.mock('../state/hooks', () => ({ useFetchDetailsLazy: () => jest.fn(), })); +jest.mock('../hooks/usePluginConfig', () => ({ + usePluginConfig: jest.fn().mockReturnValue({ value: {}, loading: false }), +})); + const mockUseGetSingle = jest.requireMock('../state/hooks').useGetSingle; +const mockUsePluginConfig = jest.requireMock('../hooks/usePluginConfig').usePluginConfig; describe('PluginDetailsPage', () => { beforeEach(() => { @@ -141,4 +146,12 @@ describe('PluginDetailsPage', () => { render(); expect(screen.getByRole('tab', { name: 'Plugin details' })).toBeInTheDocument(); }); + + it('should show "Datasource connections" tab when plugin is type of datasource', () => { + config.featureToggles.datasourceConnectionsTab = true; + mockUseGetSingle.mockReturnValue({ ...plugin, type: PluginType.datasource }); + mockUsePluginConfig.mockReturnValue({ value: {}, loading: false }); + render(); + expect(screen.getByRole('tab', { name: 'Data source connections' })).toBeVisible(); + }); }); diff --git a/public/app/features/plugins/admin/hooks/usePluginConfig.tsx b/public/app/features/plugins/admin/hooks/usePluginConfig.tsx index bf28f69ecf9..79feffc09e9 100644 --- a/public/app/features/plugins/admin/hooks/usePluginConfig.tsx +++ b/public/app/features/plugins/admin/hooks/usePluginConfig.tsx @@ -15,7 +15,6 @@ export const usePluginConfig = (plugin?: CatalogPlugin) => { config.pluginAdminExternalManageEnabled && config.featureToggles.managedPluginsInstall ? plugin.isFullyInstalled : plugin.isInstalled; - if (isPluginInstalled && !plugin.isDisabled) { return loadPlugin(plugin.id); } diff --git a/public/app/features/plugins/admin/hooks/usePluginDetailsTabs.tsx b/public/app/features/plugins/admin/hooks/usePluginDetailsTabs.tsx index eebb94e5748..e9c50269d15 100644 --- a/public/app/features/plugins/admin/hooks/usePluginDetailsTabs.tsx +++ b/public/app/features/plugins/admin/hooks/usePluginDetailsTabs.tsx @@ -99,6 +99,16 @@ export const usePluginDetailsTabs = ( }); } + if (config.featureToggles.datasourceConnectionsTab && plugin?.type === PluginType.datasource) { + navModelChildren.push({ + text: PluginTabLabels.DATASOURCE_CONNECTIONS, + icon: 'database', + id: PluginTabIds.DATASOURCE_CONNECTIONS, + url: `${pathname}?page=${PluginTabIds.DATASOURCE_CONNECTIONS}`, + active: PluginTabIds.DATASOURCE_CONNECTIONS === currentPageId, + }); + } + if (!canConfigurePlugins) { return navModelChildren; } diff --git a/public/app/features/plugins/admin/types.ts b/public/app/features/plugins/admin/types.ts index ea61ba34cb0..082d3cdf941 100644 --- a/public/app/features/plugins/admin/types.ts +++ b/public/app/features/plugins/admin/types.ts @@ -257,6 +257,7 @@ export enum PluginTabLabels { IAM = 'IAM', CHANGELOG = 'Changelog', PLUGINDETAILS = 'Plugin details', + DATASOURCE_CONNECTIONS = 'Data source connections', } export enum PluginTabIds { @@ -268,6 +269,7 @@ export enum PluginTabIds { IAM = 'iam', CHANGELOG = 'changelog', PLUGINDETAILS = 'right-panel', + DATASOURCE_CONNECTIONS = 'datasource-connections', } export enum RequestStatus { diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index b372b474e2d..7f6844d6779 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -2540,6 +2540,9 @@ } }, "details": { + "connections-tab": { + "description": "The data source connections below are all {{pluginName}}. You can find all of your data source connections of all types in <4><0>Connections - <3>Data sources." + }, "labels": { "contactGrafanaLabs": "Contact Grafana Labs", "dependencies": "Dependencies", diff --git a/public/locales/pseudo-LOCALE/grafana.json b/public/locales/pseudo-LOCALE/grafana.json index 0766bbfa14c..c87e26d6a1e 100644 --- a/public/locales/pseudo-LOCALE/grafana.json +++ b/public/locales/pseudo-LOCALE/grafana.json @@ -2540,6 +2540,9 @@ } }, "details": { + "connections-tab": { + "description": "Ŧĥę đäŧä şőūřčę čőʼnʼnęčŧįőʼnş þęľőŵ äřę äľľ {{pluginName}}. Ÿőū čäʼn ƒįʼnđ äľľ őƒ yőūř đäŧä şőūřčę čőʼnʼnęčŧįőʼnş őƒ äľľ ŧypęş įʼn <4><0>Cőʼnʼnęčŧįőʼnş - <3>Đäŧä şőūřčęş." + }, "labels": { "contactGrafanaLabs": "Cőʼnŧäčŧ Ğřäƒäʼnä Ŀäþş", "dependencies": "Đępęʼnđęʼnčįęş",