diff --git a/ui/app/components/tool-actions-form.js b/ui/app/components/tool-actions-form.js
index 2878fc0c0..b9a96e60b 100644
--- a/ui/app/components/tool-actions-form.js
+++ b/ui/app/components/tool-actions-form.js
@@ -137,6 +137,11 @@ export default Component.extend(DEFAULTS, {
       this.reset();
     },
 
+    updateTtl(evt) {
+      const ttl = evt.enabled ? `${evt.seconds}s` : '30m';
+      set(this, 'wrapTTL', ttl);
+    },
+
     codemirrorUpdated(val, codemirror) {
       codemirror.performLint();
       const hasErrors = codemirror.state.lint.marked.length > 0;
diff --git a/ui/app/templates/partials/tools/wrap.hbs b/ui/app/templates/partials/tools/wrap.hbs
index 5301927ec..02d2b7c5a 100644
--- a/ui/app/templates/partials/tools/wrap.hbs
+++ b/ui/app/templates/partials/tools/wrap.hbs
@@ -52,7 +52,14 @@
         }}
       </div>
     </div>
-  {{ttl-picker labelText='Wrap TTL' onChange=(action (mut wrapTTL))}}
+    <TtlPicker2
+      @label="Wrap TTL"
+      @initialValue="30m"
+      @onChange={{action 'updateTtl'}}
+      @helperTextDisabled="Vault will use the default (30m)"
+      @helperTextEnabled="Wrap will expire after"
+      @changeOnInit={{true}}
+    />
   </div>
   <div class="field is-grouped box is-fullwidth is-bottomless">
     <div class="control">