From 5ea26dc7eafd014e648c358a252ff95022bc8dc4 Mon Sep 17 00:00:00 2001
From: Randall Morey <randall@randallmorey.com>
Date: Tue, 25 May 2021 17:36:28 -0400
Subject: [PATCH] feature: add array fields to oidc form

---
 addons/core/translations/en-us.yaml           |   2 +
 addons/core/translations/form/en-us.yaml      |  30 ++
 .../styles/rose/components/table/_table.scss  |   8 +-
 .../form/auth-method/oidc/index.hbs           | 273 +++++++++++++++++-
 .../components/form/auth-method/oidc/index.js |  17 ++
 5 files changed, 328 insertions(+), 2 deletions(-)
 create mode 100644 ui/admin/app/components/form/auth-method/oidc/index.js

diff --git a/addons/core/translations/en-us.yaml b/addons/core/translations/en-us.yaml
index 56621bf33..5370c7e75 100644
--- a/addons/core/translations/en-us.yaml
+++ b/addons/core/translations/en-us.yaml
@@ -27,6 +27,8 @@ titles:
   abandon-confirm: Discard unsaved changes?
   toggle-color-theme: Toggle Color Theme
   welcome-to-boundary: Welcome to Boundary
+  label: Label
+  value: Value
 descriptions:
   empty-set: There are no items to display yet.  You may be able to add items or try back later.
   origin-initialization: To get started, please enter your origin URL
diff --git a/addons/core/translations/form/en-us.yaml b/addons/core/translations/form/en-us.yaml
index 974b2d313..1345b4509 100644
--- a/addons/core/translations/form/en-us.yaml
+++ b/addons/core/translations/form/en-us.yaml
@@ -70,3 +70,33 @@ disable_discovered_config_validation:
   label: Disable discovered config validation
   help: >
     If the Authorization Server's discovered configuration contains values that do not match the configuration set on this auth method, this can be set to force the local configuration to override the discovered values.  This is useful in the case of slow-changing or incorrect values announced by the Authorization Server. NOTE: For safety, not providing this value will be treated the same as "false"; that is, every time the method is updated or the state is changed, this value must be set to "true" or it will be disabled.
+idp_ca_certs:
+  label: Certificates
+  help: Optional PEM-encoded X.509 CA certificates that can be used as trust anchors when connecting to an OIDC provider.
+certificate:
+  label: Certificate
+allowed_audiences:
+  label: Allowed Audiences
+  help: Allowed audience claims for this auth method.
+claim:
+  label: Claim
+claims_scopes:
+  label: Claims Scopes
+  help: Optional claims scopes that will be requested during authentication.
+claims_scope:
+  label: Claims Scope
+account_claim_maps:
+  label: Account Claim Maps
+  help: >
+    Optional claim maps from custom claims to the standard claims of sub, name and email.  These maps are represented as key=value where the key equals the from_claim and the value equals the to_claim.  For example "oid=sub".
+account_claim_map:
+  label: Account Claim Map
+from_claim:
+  label: From Claim
+to_claim:
+  label: To Claim
+signing_algorithms:
+  label: Signing Algorithms
+  help: The signing algorithms allowed for the auth method.
+algorithm:
+  label: Algorithm
diff --git a/addons/rose/addon/styles/rose/components/table/_table.scss b/addons/rose/addon/styles/rose/components/table/_table.scss
index 81a815a24..c4a839020 100644
--- a/addons/rose/addon/styles/rose/components/table/_table.scss
+++ b/addons/rose/addon/styles/rose/components/table/_table.scss
@@ -11,13 +11,19 @@
   }
 
   // This styles are add to stop the input to apply extra margin (default on forms)
+  .rose-form-input,
   .rose-form-input-field,
   .rose-form-select,
-  .rose-form-input {
+  .rose-form-select-field {
     margin: 0;
     width: 100%;
   }
 
+  // Fix margin issue with textarea elements inside tables
+  textarea {
+    display: block;
+  }
+
   .rose-table-cell,
   .rose-table-header-cell {
     vertical-align: middle;
diff --git a/ui/admin/app/components/form/auth-method/oidc/index.hbs b/ui/admin/app/components/form/auth-method/oidc/index.hbs
index f157e5090..c7ac8ad4a 100644
--- a/ui/admin/app/components/form/auth-method/oidc/index.hbs
+++ b/ui/admin/app/components/form/auth-method/oidc/index.hbs
@@ -119,6 +119,277 @@
     {{/if}}
   </form.input>
 
+  {{! Signing Algorithms }}
+  <Rose::Form::Fieldset>
+    <:title>{{t 'form.signing_algorithms.label'}}</:title>
+    <:description>{{t 'form.signing_algorithms.help'}}</:description>
+    <:body>
+      <Rose::Table @style="condensed" as |table|>
+        <table.header as |header|>
+          <header.row @hidden={{true}} as |row|>
+            <row.headerCell>{{t 'titles.value'}}</row.headerCell>
+            <row.headerCell>{{t 'titles.actions'}}</row.headerCell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model.attributes.signing_algorithms as |algorithm i|}}
+            <body.row as |row|>
+              <row.cell>
+                <form.select
+                  @value={{algorithm.value}}
+                  @error={{@model.errors.attributes.signing_algorithms}}
+                  @contextual={{true}}
+                  @onChange={{fn (mut algorithm.value)}}
+                as |field|>
+                  <field.label>{{t 'form.algorithm.label'}}</field.label>
+                  <field.field as |select|>
+                    {{#each this.signingAlgorithms as |algorithm|}}
+                      <select.option @value={{algorithm}}>{{algorithm}}</select.option>
+                    {{/each}}
+                  </field.field>
+                  {{#if @model.errors.attributes.signing_algorithms}}
+                    <field.errors as |errors|>
+                      {{#each @model.errors.attributes.signing_algorithms as |error|}}
+                        <errors.message>{{error.message}}</errors.message>
+                      {{/each}}
+                    </field.errors>
+                  {{/if}}
+                </form.select>
+              </row.cell>
+              <row.cell @shrink={{true}}>
+                <Rose::Button
+                  @style='secondary'
+                  @iconOnly='trash'
+                  title={{t 'actions.remove'}}
+                >
+                  {{t 'actions.remove'}}
+                </Rose::Button>
+              </row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+    </:body>
+  </Rose::Form::Fieldset>
+
+  {{! Certificates }}
+  <Rose::Form::Fieldset>
+    <:title>{{t 'form.idp_ca_certs.label'}}</:title>
+    <:description>{{t 'form.idp_ca_certs.help'}}</:description>
+    <:body>
+      <Rose::Table @style="condensed" as |table|>
+        <table.header as |header|>
+          <header.row @hidden={{true}} as |row|>
+            <row.headerCell>{{t 'titles.value'}}</row.headerCell>
+            <row.headerCell>{{t 'titles.actions'}}</row.headerCell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model.attributes.idp_ca_certs as |cert i|}}
+            <body.row as |row|>
+              <row.cell>
+                <form.textarea
+                  @value={{cert.value}}
+                  @error={{@model.errors.attributes.idp_ca_certs}}
+                  @contextual={{true}}
+                as |field|>
+                  <field.label>{{t 'form.certificate.label'}}</field.label>
+                  <field.field />
+                  {{#if @model.errors.attributes.idp_ca_certs}}
+                    <field.errors as |errors|>
+                      {{#each @model.errors.attributes.idp_ca_certs as |error|}}
+                        <errors.message>{{error.message}}</errors.message>
+                      {{/each}}
+                    </field.errors>
+                  {{/if}}
+                </form.textarea>
+              </row.cell>
+              <row.cell @shrink={{true}}>
+                <Rose::Button
+                  @style='secondary'
+                  @iconOnly='trash'
+                  title={{t 'actions.remove'}}
+                >
+                  {{t 'actions.remove'}}
+                </Rose::Button>
+              </row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+    </:body>
+  </Rose::Form::Fieldset>
+
+  {{! Allowed Audiences }}
+  <Rose::Form::Fieldset>
+    <:title>{{t 'form.allowed_audiences.label'}}</:title>
+    <:description>{{t 'form.allowed_audiences.help'}}</:description>
+    <:body>
+      <Rose::Table @style="condensed" as |table|>
+        <table.header as |header|>
+          <header.row @hidden={{true}} as |row|>
+            <row.headerCell>{{t 'titles.value'}}</row.headerCell>
+            <row.headerCell>{{t 'titles.actions'}}</row.headerCell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model.attributes.allowed_audiences as |audience i|}}
+            <body.row as |row|>
+              <row.cell>
+                <form.input
+                  @type='text'
+                  @value={{audience.value}}
+                  @error={{@model.errors.attributes.allowed_audiences}}
+                  @contextual={{true}}
+                as |field|>
+                  <field.label>{{t 'form.claim.label'}}</field.label>
+                  <field.field />
+                  {{#if @model.errors.attributes.allowed_audiences}}
+                    <field.errors as |errors|>
+                      {{#each @model.errors.attributes.allowed_audiences as |error|}}
+                        <errors.message>{{error.message}}</errors.message>
+                      {{/each}}
+                    </field.errors>
+                  {{/if}}
+                </form.input>
+              </row.cell>
+              <row.cell @shrink={{true}}>
+                <Rose::Button
+                  @style='secondary'
+                  @iconOnly='trash'
+                  title={{t 'actions.remove'}}
+                >
+                  {{t 'actions.remove'}}
+                </Rose::Button>
+              </row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+    </:body>
+  </Rose::Form::Fieldset>
+
+  {{! Claims Scopes }}
+  <Rose::Form::Fieldset>
+    <:title>{{t 'form.claims_scopes.label'}}</:title>
+    <:description>{{t 'form.claims_scopes.help'}}</:description>
+    <:body>
+      <Rose::Table @style="condensed" as |table|>
+        <table.header as |header|>
+          <header.row @hidden={{true}} as |row|>
+            <row.headerCell>{{t 'titles.value'}}</row.headerCell>
+            <row.headerCell></row.headerCell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model.attributes.claims_scopes as |claimsScope i|}}
+            <body.row as |row|>
+              <row.cell>
+                <form.input
+                  @type='text'
+                  @value={{claimsScope.value}}
+                  @error={{@model.errors.attributes.claims_scopes}}
+
+                as |field|>
+                  <field.label>{{t 'form.claims_scope.label'}}</field.label>
+                  <field.field />
+                  {{#if @model.errors.attributes.claims_scopes}}
+                    <field.errors as |errors|>
+                      {{#each @model.errors.attributes.claims_scopes as |error|}}
+                        <errors.message>{{error.message}}</errors.message>
+                      {{/each}}
+                    </field.errors>
+                  {{/if}}
+                </form.input>
+              </row.cell>
+              <row.cell @shrink={{true}}>
+                <Rose::Button
+                  @style='secondary'
+                  @iconOnly='trash'
+                  title={{t 'actions.remove'}}
+                >
+                  {{t 'actions.remove'}}
+                </Rose::Button>
+              </row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+    </:body>
+  </Rose::Form::Fieldset>
+
+  {{! Account Claim Maps }}
+  <Rose::Form::Fieldset>
+    <:title>{{t 'form.account_claim_maps.label'}}</:title>
+    <:description>{{t 'form.account_claim_maps.help'}}</:description>
+    <:body>
+      <Rose::Table @style="condensed" as |table|>
+        <table.header as |header|>
+          <header.row as |row|>
+            <row.headerCell>{{t 'form.from_claim.label'}}</row.headerCell>
+            <row.headerCell>{{t 'form.to_claim.label'}}</row.headerCell>
+            <row.headerCell>{{t 'titles.actions'}}</row.headerCell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model.attributes.account_claim_maps as |claimMap i|}}
+            <body.row as |row|>
+              <row.cell>
+                <form.input
+                  @type='text'
+                  @value={{claimMap.from}}
+                  @error={{@model.errors.attributes.account_claim_maps}}
+                  @contextual={{true}}
+                as |field|>
+                  <field.label>{{t 'form.from_claim.label'}}</field.label>
+                  <field.field />
+                  {{#if @model.errors.attributes.account_claim_maps}}
+                    <field.errors as |errors|>
+                      {{#each @model.errors.attributes.account_claim_maps as |error|}}
+                        <errors.message>{{error.message}}</errors.message>
+                      {{/each}}
+                    </field.errors>
+                  {{/if}}
+                </form.input>
+              </row.cell>
+              <row.cell>
+                <form.select
+                  @value={{claimMap.to}}
+                  @error={{@model.errors.attributes.account_claim_maps}}
+                  @contextual={{true}}
+                  @onChange={{fn (mut claimMap.to)}}
+                as |field|>
+                  <field.label>{{t 'form.to_claim.label'}}</field.label>
+                  <field.field as |select|>
+                    {{#each this.toClaims as |toClaim|}}
+                      <select.option @value={{toClaim}}>{{toClaim}}</select.option>
+                    {{/each}}
+                  </field.field>
+                  {{#if @model.errors.attributes.account_claim_maps}}
+                    <field.errors as |errors|>
+                      {{#each @model.errors.attributes.account_claim_maps as |error|}}
+                        <errors.message>{{error.message}}</errors.message>
+                      {{/each}}
+                    </field.errors>
+                  {{/if}}
+                </form.select>
+              </row.cell>
+              <row.cell @shrink={{true}}>
+                <Rose::Button
+                  @style='secondary'
+                  @iconOnly='trash'
+                  title={{t 'actions.remove'}}
+                >
+                  {{t 'actions.remove'}}
+                </Rose::Button>
+              </row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+    </:body>
+  </Rose::Form::Fieldset>
+
   <form.input
     @name='max_age'
     @type='number'
@@ -165,4 +436,4 @@
     @submitText={{t 'actions.save'}}
     @cancelText={{t 'actions.cancel'}}
   />
-</Rose::Form>
\ No newline at end of file
+</Rose::Form>
diff --git a/ui/admin/app/components/form/auth-method/oidc/index.js b/ui/admin/app/components/form/auth-method/oidc/index.js
new file mode 100644
index 000000000..4e4ac6f8b
--- /dev/null
+++ b/ui/admin/app/components/form/auth-method/oidc/index.js
@@ -0,0 +1,17 @@
+import Component from '@glimmer/component';
+import { options } from 'api/models/auth-method';
+
+export default class FormAuthMethodOidcComponent extends Component {
+
+  // =attributes
+  /**
+   * @type {object}
+   */
+  signingAlgorithms = options.oidc.signing_algorithms;
+
+  /**
+   * @type {object}
+   */
+  toClaims = options.oidc.account_claim_maps.to;
+
+}