grafana/public/app/plugins/datasource/cloudwatch/partials/config.html

<h3 class="page-heading">CloudWatch details</h3>

<div class="gf-form-group max-width-30">
  <div class="gf-form gf-form-select-wrapper">
    <label class="gf-form-label width-13">Auth Provider</label>
    <select class="gf-form-input gf-max-width-13" ng-model="ctrl.current.jsonData.authType" ng-options="f.value as f.name for f in ctrl.authTypes"></select>
  </div>

  <div class="gf-form" ng-show='ctrl.current.jsonData.authType == "credentials"'>
    <label class="gf-form-label width-13">Credentials profile name</label>
    <input type="text" class="gf-form-input max-width-18" ng-model='ctrl.current.database' placeholder="default"></input>
    <info-popover mode="right-absolute">
      Credentials profile name, as specified in ~/.aws/credentials, leave blank for default
    </info-popover>
  </div>

  <div class="gf-form" ng-show='ctrl.current.jsonData.authType == "keys"'>
    <label class="gf-form-label width-13">Access key ID </label>
    <label class="gf-form-label width-13" ng-show="ctrl.accessKeyExist">Configured</label>
    <a class="btn btn-secondary gf-form-btn" type="submit" ng-click="ctrl.resetAccessKey()" ng-show="ctrl.accessKeyExist">Reset</a>
    <input type="text" class="gf-form-input max-width-18" ng-hide="ctrl.accessKeyExist" ng-model='ctrl.current.secureJsonData.accessKey'></input>
  </div>

  <div class="gf-form" ng-show='ctrl.current.jsonData.authType == "keys"'>
    <label class="gf-form-label width-13">Secret access key</label>
    <label class="gf-form-label width-13" ng-show="ctrl.secretKeyExist">Configured</label>
    <a class="btn btn-secondary gf-form-btn" type="submit" ng-click="ctrl.resetSecretKey()" ng-show="ctrl.secretKeyExist">Reset</a>
    <input type="text" class="gf-form-input max-width-18" ng-hide="ctrl.secretKeyExist" ng-model='ctrl.current.secureJsonData.secretKey'></input>
  </div>

  <div class="gf-form" ng-show='ctrl.current.jsonData.authType == "arn"'>
    <label class="gf-form-label width-13">Assume Role ARN</label>
    <input type="text" class="gf-form-input max-width-18" ng-model='ctrl.current.jsonData.assumeRoleArn' placeholder="arn:aws:iam:*"></input>
    <info-popover mode="right-absolute">
      ARN of Assume Role
    </info-popover>
  </div>

  <div class="gf-form">
    <label class="gf-form-label width-13">Default Region</label>
    <div class="gf-form-select-wrapper max-width-18 gf-form-select-wrapper--has-help-icon">
      <select class="gf-form-input" ng-model="ctrl.current.jsonData.defaultRegion" ng-options="region for region in ['ap-northeast-1', 'ap-northeast-2', 'ap-southeast-1', 'ap-southeast-2', 'ap-south-1', 'ca-central-1', 'cn-north-1', 'cn-northwest-1', 'eu-central-1', 'eu-west-1', 'eu-west-2', 'sa-east-1', 'us-east-1', 'us-east-2', 'us-gov-west-1', 'us-west-1', 'us-west-2']"></select>
      <info-popover mode="right-absolute">
        Specify the region, such as for US West (Oregon) use ` us-west-2 ` as the region.
      </info-popover>
    </div>
  </div>
  <div class="gf-form">
    <label class="gf-form-label width-13">Custom Metrics</label>
    <input type="text" class="gf-form-input max-width-18" ng-model='ctrl.current.jsonData.customMetricsNamespaces' placeholder="Namespace1,Namespace2"></input>
    <info-popover mode="right-absolute">
      Namespaces of Custom Metrics
    </info-popover>
  </div>
</div>