From e18efe36d516a3ca102ee8a4704d82d87bd82436 Mon Sep 17 00:00:00 2001
From: Julian Waller <git@julusian.co.uk>
Date: Wed, 20 Sep 2023 22:16:54 +0100
Subject: [PATCH] feat: indiciate variables support on input field

---
 webui/src/Controls/OptionsInputField.jsx |  9 ++++++---
 webui/src/scss/_button-edit.scss         | 12 +++++++++++-
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/webui/src/Controls/OptionsInputField.jsx b/webui/src/Controls/OptionsInputField.jsx
index 3b38a8885..533d1073f 100644
--- a/webui/src/Controls/OptionsInputField.jsx
+++ b/webui/src/Controls/OptionsInputField.jsx
@@ -9,7 +9,7 @@ import {
 } from '../Components'
 import { InternalCustomVariableDropdown, InternalInstanceField } from './InternalInstanceFields'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faQuestionCircle } from '@fortawesome/free-solid-svg-icons'
+import { faDollarSign, faQuestionCircle } from '@fortawesome/free-solid-svg-icons'
 
 export function OptionsInputField({
 	instanceId,
@@ -29,6 +29,7 @@ export function OptionsInputField({
 	}
 
 	let control = undefined
+	let features = {}
 	switch (option.type) {
 		case 'textinput': {
 			control = (
@@ -42,6 +43,7 @@ export function OptionsInputField({
 					setValue={setValue2}
 				/>
 			)
+			features.variables = !!option.useVariables
 			break
 		}
 		case 'dropdown': {
@@ -134,9 +136,10 @@ export function OptionsInputField({
 		<CFormGroup style={{ display: visibility === false ? 'none' : null }}>
 			<CLabel>
 				{option.label}
-				{option.tooltip && (
-					<FontAwesomeIcon style={{ marginLeft: '5px' }} icon={faQuestionCircle} title={option.tooltip} />
+				{features.variables && (
+					<FontAwesomeIcon className="feature-icon" icon={faDollarSign} title={'Supports variables'} />
 				)}
+				{option.tooltip && <FontAwesomeIcon icon={faQuestionCircle} title={option.tooltip} />}
 			</CLabel>
 			{control}
 		</CFormGroup>
diff --git a/webui/src/scss/_button-edit.scss b/webui/src/scss/_button-edit.scss
index 72d2f8d91..7f07e3e27 100644
--- a/webui/src/scss/_button-edit.scss
+++ b/webui/src/scss/_button-edit.scss
@@ -18,8 +18,18 @@
 	label {
 		justify-content: left;
 		font-weight: bold;
-		font-size: 0.85em;
+		font-size: 0.95em;
 		margin-bottom: 0.15rem;
+
+		svg {
+			margin-left: 5px;
+
+			&.feature-icon {
+				margin-left: 3px;
+
+				font-size: 0.8rem;
+			}
+		}
 	}
 
 	.png-browse {