vault/ui/app/components/tools/wrap.hbs
Zack Moore e6ce95acd3
Replace codemirror 6 code editor with HDS CodeEditor component (#30188)
* Completed initial replacement of editor

* fixing ts issues

* removing codemirror modifier and deps

* working on replacing the code editor

* addressing linting concerns

* cleaning up policy-form editor

* fixing linting issues

* fixing linting issues

* fixing tests

* fixing tests

* fixing tests

* fixing tests

* fixing failing tests

* cleaning up PR

* fixing tests

* remove outdated message for navigating editor

* fix linting in tests

* add changelog

* fix tests

* update naming

* remove unused lint param + name changes

* update test selector usage

* update test selector usage

* update test selector usage

* lint fixes

* replace page object selectors

* lint fix

* fix lint

* fix lint after merge

* update tests

* remove import

---------

Co-authored-by: Lane Wetmore <lane.wetmore@hashicorp.com>
2025-07-23 11:12:20 -07:00

89 lines
No EOL
2.7 KiB
Handlebars

{{!
Copyright (c) HashiCorp, Inc.
SPDX-License-Identifier: BUSL-1.1
}}
<PageHeader as |p|>
<p.levelLeft>
<h1 class="title is-3">
Wrap Data
</h1>
</p.levelLeft>
</PageHeader>
{{#if this.token}}
<div class="box is-sideless is-fullwidth is-marginless">
<div class="field">
<label for="wrap-info" class="is-label">Wrapped token</label>
<Hds::Copy::Snippet
@textToCopy={{this.token}}
@color="secondary"
data-test-tools-input="wrapping-token"
@onError={{fn (set-flash-message "Clipboard copy failed. The Clipboard API requires a secure context." "danger")}}
/>
</div>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<Hds::ButtonSet>
<Hds::Button
@icon="arrow-left"
@text="Back"
@color="tertiary"
{{on "click" (fn this.reset false)}}
data-test-button="Back"
/>
<Hds::Button @text="Done" @color="secondary" {{on "click" this.reset}} data-test-button="Done" />
</Hds::ButtonSet>
</div>
{{else}}
<form {{on "submit" this.handleSubmit}}>
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="perform" @noun="wrap" />
<MessageError @errorMessage={{this.errorMessage}} />
<Toolbar>
<ToolbarFilters>
<Toggle @name="json" @checked={{this.showJson}} @onChange={{this.handleToggle}}>
<span class="has-text-grey">JSON</span>
</Toggle>
</ToolbarFilters>
</Toolbar>
{{#if this.showJson}}
<JsonEditor
class="has-top-margin-s"
@title="Data to wrap"
@subTitle="json-formatted"
@value={{this.stringifiedWrapData}}
@valueUpdated={{this.editorUpdated}}
/>
{{else}}
<KvObjectEditor
class="has-top-margin-l"
@label="Data to wrap"
@value={{this.wrapData}}
@onChange={{fn (mut this.wrapData)}}
@warnNonStringValues={{true}}
/>
{{/if}}
<TtlPicker
@label="Wrap TTL"
@initialValue="30m"
@onChange={{this.updateTtl}}
@helperTextDisabled="Vault will use the default (30m)"
@helperTextEnabled="Wrap will expire after"
@changeOnInit={{true}}
/>
{{#if this.hasLintingErrors}}
<AlertInline
@color="warning"
class="has-top-padding-s"
@message="JSON is unparsable. Fix linting errors to avoid data discrepancies."
/>
{{/if}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<Hds::Button @text="Wrap data" type="submit" data-test-submit />
</div>
</div>
</form>
{{/if}}