Add "Admin" tab to the registrar console

This tab will set the "allowedTlds", but might have other functionality in the
future.

It is based on (branches from) the security-settings tab, because I'm copying the functionality of the "whitelisted IPs" to the "allowed TLDs": they are both lists of "arbitrary" strings that you can remove from and add to.

There are a lot of moving parts in this CL, because of how all the different elements need to interact, and how intertwined they are (for example, we need to disable the admin-settings view for non admins both in the soy and in the JS code)

It's really time to refactor the console given all we've learned... :/

-------------
Created by MOE: https://github.com/google/moe
MOE_MIGRATED_REVID=220373443
This commit is contained in:
guyben 2018-11-06 16:23:46 -08:00 committed by jianglai
parent 9b10c116f3
commit 61a5cf307e
11 changed files with 274 additions and 4 deletions

View file

@ -0,0 +1,69 @@
// Copyright 2018 The Nomulus Authors. All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
{namespace registry.soy.registrar.admin}
/** Registrar admin settings page for view and edit. */
{template .settings}
{@param clientId: string}
{@param allowedTlds: list<string>}
{@param readonly: bool}
<form name="item" class="{css('item')} {css('registrar')}">
<h1>Administrator settings for {$clientId}</h1>
{if $readonly}
<p>Use the 'Edit' button above to switch to enable editing the information below.
{/if}
<table>
<tr class="{css('kd-settings-pane-section')}">
<td>
<label class="{css('setting-label')}">Allowed TLDs</label>
<span class="{css('description')}">set or remove TLDs this
client is allowed access to.</span>
</td>
<td class="{css('setting')}">
<div class="{css('info')} {css('summary')}">
<div id="tlds">
{for $tld in $allowedTlds}
{call .tld}
{param name: 'allowedTlds[' + index($tld) + ']' /}
{param tld: $tld /}
{/call}
{/for}
</div>
<div class="{css('hidden')}">
<input id="newTld" value="" placeholder="Enter TLD"/>
<button id="btn-add-tld" type="button"
class="{css('kd-button')} {css('btn-add')}">Add</button>
</div>
</div>
</td>
</table>
</form>
{/template}
/** TLD form input. */
{template .tld}
{@param name: string}
{@param tld: string}
<div class="{css('tld')}">
<button type="button" class="{css('kd-button')} {css('btn-remove')} {css('hidden')}">
<i class="{css('icon-remove')} {css('edit')}">x</i>
</button>
<input name="{$name}" value="{$tld}" readonly>
</div>
{/template}