mirror of
https://github.com/unraid/api.git
synced 2026-01-04 15:39:52 -06:00
feat: connect settings web component (#1211)
Replaces the Connect Settings form at Settings > Management Access with a webcomponent containing a generated form. CodeRabbit: - **New Features** - Enhanced connection settings with an updated UI, including a new custom element `<unraid-connect-settings>`. - Introduced several new form components (e.g., `NumberField`, `StringArrayField`, `Select`, `Switch`, `PreconditionsLabel`, `ControlLayout`, and `VerticalLayout`) for a more dynamic experience. - Added a notification system with the `Toaster` component for user feedback. - New GraphQL operations for managing connection settings and API updates. - **Chores** - Upgraded multiple backend and frontend dependencies and refined configuration files. - **Tests** - Expanded test coverage for CSV conversion, form settings merging, and the new `csvStringToArray` function. - **Documentation** - Added introductory documentation for form components and a readme for the forms directory.
This commit is contained in:
Pujit Mehrotra
@@ -486,143 +486,6 @@ $('body').on('click', '.js-setCurrentHostExtraOrigins', function(e) {
|
||||
});
|
||||
</script>
|
||||
|
||||
<form id="UnraidNetSettings" markdown="1" name="UnraidNetSettings" method="POST" action="/update.htm" target="progressFrame">
|
||||
<?
|
||||
/**
|
||||
* Allowed origins warning displayed when the current webGUI URL is NOT included in the known lists of allowed origins.
|
||||
* Include localhost in the test, but only display HTTP(S) URLs that do not include localhost.
|
||||
*/
|
||||
?>
|
||||
<? if ($serverState->combinedKnownOrigins): ?>
|
||||
<div markdown="1" class="<?=$shade?>"><!-- begin allowedOrigins warning -->
|
||||
<dl>
|
||||
<div style="margin-bottom: 2rem;">
|
||||
<span class="orange-text">
|
||||
<i class='fa fa-warning fa-fw'></i> <strong>_(Warning)_</strong></span>
|
||||
<?= sprintf(_('Your current url **%s** is not in the list of allowed origins for this server'), $serverState->host) ?>.
|
||||
<br/>
|
||||
_(For best results, add the current url to the **Unraid API extra origins** field below then apply the change)_.
|
||||
<br>
|
||||
<dd>
|
||||
<p>_(Known Origins)_:</p>
|
||||
<ul>
|
||||
<? foreach($serverState->combinedKnownOrigins as $origin): ?>
|
||||
<li><a href="<?= $origin ?>"><?= $origin ?></a></li>
|
||||
<? endforeach ?>
|
||||
</ul>
|
||||
<dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div><!-- end Account section -->
|
||||
<? endif ?>
|
||||
|
||||
<div markdown="1" class="<?=$shade?>"><!-- begin Remote Access section -->
|
||||
|
||||
_(Allow Remote Access)_:
|
||||
<?if(!$isRegistered): // NOTE: manually added close tags so the next section would not be indented ?>
|
||||
: <span><i class="fa fa-warning icon warning"></i> _(Disabled until you have signed in)_</span></dd></dl>
|
||||
<?elseif(!$isMiniGraphConnected && $myServersFlashCfg['remote']['wanaccess']!="yes"): // NOTE: manually added close tags so the next section would not be indented ?>
|
||||
: <span><i class="fa fa-warning icon warning"></i> _(Disabled until connected to Unraid Connect Cloud - try reloading the page)_</span></dd></dl>
|
||||
<?elseif(!$hasMyUnraidNetCert): // NOTE: manually added close tags so the next section would not be indented ?>
|
||||
: <span><i class="fa fa-warning icon warning"></i> _(Disabled until you Provision a myunraid.net SSL Cert)_</span><input type="hidden" id="wanport" value="0"></dd></dl>
|
||||
<?elseif(!$boolWebUIAuth): // NOTE: manually added close tags so the next section would not be indented ?>
|
||||
: <span><i class="fa fa-warning icon warning"></i> _(Disabled until your root user account is password-protected)_</span><input type="hidden" id="wanport" value="0"></dd></dl>
|
||||
<?else: // begin show remote access form ?>
|
||||
: <select id="remoteAccess" name="remoteAccess" data-orig="<?=$currentRemoteAccessValue?>" onchange="changeRemoteAccess(this)" style="vertical-align: top;">
|
||||
<?=mk_option($currentRemoteAccessValue, "OFF", _("Off"))?>
|
||||
<?=mk_option($currentRemoteAccessValue, "DYNAMIC_UPNP", _("Dynamic - UPnP"), $var['USE_UPNP'] === 'no' ? 'disabled' : '')?>
|
||||
<?=mk_option($currentRemoteAccessValue, "DYNAMIC_MANUAL", _("Dynamic - Manual Port Forward"), $var['USE_SSL'] !== 'auto' ? 'disabled' : '')?>
|
||||
<?=mk_option($currentRemoteAccessValue, "ALWAYS_UPNP", _("Always On - UPnP"), $var['USE_UPNP'] === 'no' ? 'disabled' : '')?>
|
||||
<?=mk_option($currentRemoteAccessValue, "ALWAYS_MANUAL", _("Always On - Manual Port Forward"))?>
|
||||
</select> <span id="remoteAccessMsg"></span>
|
||||
|
||||
<?if($var['USE_UPNP'] === 'no'):?>
|
||||
|
||||
: _(Remark: to use the UPnP options please set "Use UPnP" to "Yes" in Management Access.)_
|
||||
<?endif // end check for ($var['USE_UPNP']) ?>
|
||||
|
||||
<?if($var['USE_SSL'] !== 'auto'):?>
|
||||
|
||||
: _(Remark: to use the "Dynamic - Manual Port Forward" option for Remote Access please set "Use SSL/TLS" to "Strict" in Management Access.)_
|
||||
<?endif?>
|
||||
|
||||
|
||||
: <unraid-i18n-host><unraid-wan-ip-check php-wan-ip="<?=http_get_contents('https://wanip4.unraid.net/')?>"></unraid-wan-ip-check></unraid-i18n-host>
|
||||
|
||||
<div markdown="1" id="wanpanel" style="display:'none'">
|
||||
|
||||
_(WAN Port)_:
|
||||
: <input type="number" id="wanport" onchange="enableDisableCheckButton()" onkeyup="enableDisableCheckButton()" data-orig="<?=$myServersFlashCfg['remote']['wanport']?>" class="trim" min="0" max="65535" value="<?=htmlspecialchars($myServersFlashCfg['remote']['wanport'])?>"> <span id="wanportdisplay" style="display:'none'"><?=$myServersFlashCfg['remote']['wanport']?> </span> <button type="button" id="wancheck" onclick="dnsCheckServer(this)" style="margin-top: 0">_(Check)_</button>
|
||||
<span id="wanportmsg"><?=sprintf(_("Remark: configure your router with port forwarding of port") . " <strong>%u/TCP</strong> " . _("to") . " <strong>%s:%u</strong>", $myServersFlashCfg['remote']['wanport'], htmlspecialchars($eth0['IPADDR:0']??''), $var['PORTSSL']??443)?></span>
|
||||
|
||||
:unraidnet_wanpanel_help:
|
||||
|
||||
</div>
|
||||
<? /** for the time being only display remote T2FA field when enabled manually by Unraid developers */ ?>
|
||||
<?if($showT2Fa):?>
|
||||
<?
|
||||
$remoteT2faRemarks = [
|
||||
'all' => _('Remote T2FA requires Remote Access to be enabled and a *.myunraid.net certificate'),
|
||||
'needRemote' => _('Remote T2FA requires Remote Access to be enabled'),
|
||||
'needRemoteAndCert' => _('Remote T2FA requires Remote Access to be enabled and a *.myunraid.net certificate'),
|
||||
'needCert' => _('Remote T2FA requires a *.myunraid.net certificate'),
|
||||
];
|
||||
|
||||
if ($enableRemoteT2fa)
|
||||
$remoteT2faRemark = '';
|
||||
elseif ($currentRemoteAccessValue === 'OFF' && $hasMyUnraidNetCert)
|
||||
$remoteT2faRemark = $remoteT2faRemarks['needRemote'];
|
||||
elseif ($currentRemoteAccessValue === 'OFF' && !$hasMyUnraidNetCert)
|
||||
$remoteT2faRemark = $remoteT2faRemarks['needRemoteAndCert'];
|
||||
elseif ($currentRemoteAccessValue !== 'OFF' && !$hasMyUnraidNetCert)
|
||||
$remoteT2faRemark = $remoteT2faRemarks['needCert'];
|
||||
else
|
||||
$remoteT2faRemark = $remoteT2faRemarks['all'];
|
||||
|
||||
$localT2faRemarks = [
|
||||
'all' => _('Local T2FA requires Use SSL/TLS to be Strict and a *.myunraid.net certificate'),
|
||||
'needSSLAuto' => _('Local T2FA requires Use SSL/TLS to be Strict'),
|
||||
'needSSLAutoAndCert' => _('Local T2FA requires Use SSL/TLS to be Strict and a *.myunraid.net certificate'),
|
||||
'needCert' => _('Local T2FA requires a *.myunraid.net certificate'),
|
||||
];
|
||||
|
||||
if($enableLocalT2fa)
|
||||
$localT2faRemark = '';
|
||||
elseif ($var['USE_SSL'] !== 'auto' && $hasMyUnraidNetCert)
|
||||
$localT2faRemark = $localT2faRemarks['needSSLAuto'];
|
||||
elseif ($var['USE_SSL'] !== 'auto' && !$hasMyUnraidNetCert)
|
||||
$localT2faRemark = $localT2faRemarks['needSSLAutoAndCert'];
|
||||
elseif ($var['USE_SSL'] === 'auto' && !$hasMyUnraidNetCert)
|
||||
$localT2faRemark = $localT2faRemarks['needCert'];
|
||||
else
|
||||
$localT2faRemark = $localT2faRemarks['all'];
|
||||
?>
|
||||
|
||||
_(Enable Transparent 2FA for Remote Access)_<!-- do not index -->:
|
||||
: <select id="remote2fa" size="1" <?=($enableRemoteT2fa ? '' : 'disabled')?>>
|
||||
<?=mk_option($myServersFlashCfg['remote']['2Fa']??'', "no", _("No"))?>
|
||||
<?=mk_option($myServersFlashCfg['remote']['2Fa']??'', "yes", _("Yes"))?>
|
||||
</select> <span id="remote2fa_remark" style="display:<?=($enableRemoteT2fa ? 'none' : 'inline')?>;"><?=$remoteT2faRemark??''?></span>
|
||||
|
||||
:myservers_remote_t2fa_help:
|
||||
|
||||
_(Enable Transparent 2FA for Local Access)_<!-- do not index -->:
|
||||
: <select id="local2fa" size="1" <?=($enableLocalT2fa ? '' : 'disabled')?>>
|
||||
<?=mk_option($myServersFlashCfg['local']['2Fa']??'', "no", _("No"))?>
|
||||
<?=mk_option($myServersFlashCfg['local']['2Fa']??'', "yes", _("Yes"))?>
|
||||
</select> <span id="local2fa_remark" style="display:<?=($enableLocalT2fa ? 'none' : 'inline')?>;"><?=$localT2faRemark??''?></span>
|
||||
|
||||
:myservers_local_t2fa_help:
|
||||
<?endif // end check for showT2Fa ?>
|
||||
|
||||
|
||||
: <button class="applyBtn" type="button" onclick="registerServer(this)" disabled="disabled">_(Apply)_</button> <span id="useConnectMsg"></span>
|
||||
|
||||
<?endif // end check for (!$boolWebUIAuth) ?>
|
||||
|
||||
</div><!-- end Remote Access section -->
|
||||
</form>
|
||||
|
||||
<div markdown="1" class="<?=$shade?>"><!-- begin Flash Backup section -->
|
||||
_(Flash backup)_:
|
||||
<?if(!$isRegistered):?>
|
||||
@@ -702,36 +565,5 @@ $(function() {
|
||||
</div><!-- end Flash Backup section -->
|
||||
|
||||
<!-- start unraid-api section -->
|
||||
<div markdown="1" class="js-unraidApiLogs <?=$shade?>">
|
||||
|
||||
: <span>_(Questions? See <a href="https://docs.unraid.net/go/connect/" target="_blank">the documentation</a>.)_</span>
|
||||
|
||||
_(Account status)_:
|
||||
: <unraid-i18n-host><unraid-auth></unraid-auth></unraid-i18n-host>
|
||||
|
||||
<!-- start extra origins -->
|
||||
<span id="extraOriginsSettings" class="js-extraOriginsLabel">_(Unraid API extra origins)_:</span>
|
||||
: <input class="js-extraOrigins" name="extraOrigins" type="text" value="<?=$myServersFlashCfg['api']['extraOrigins']??''?>">
|
||||
|
||||
:unraidnet_extraorigins_help:
|
||||
|
||||
|
||||
: <div>
|
||||
<? if ($serverState->combinedKnownOrigins): ?> <button class="js-setCurrentHostExtraOrigins" href="#extraOriginsSettings">_(Add Current Origin)_</button><? endif ?> <button class="js-extraOriginsApply" type="button" onclick="applyExtraOrigins(this)" disabled="disabled">_(Apply)_</button>
|
||||
</div>
|
||||
<!-- // end extra origins -->
|
||||
|
||||
|
||||
<?if($isRegistered):?>
|
||||
_(Connected to Unraid Connect Cloud)_:
|
||||
<?if($isMiniGraphConnected):?>
|
||||
: _(Yes)_
|
||||
<?else:?>
|
||||
: <i class="fa fa-warning icon warning"></i> _(No)_
|
||||
<?endif // end check for ($isMiniGraphConnected) ?>
|
||||
<?endif // end check for ($isRegistered) ?>
|
||||
|
||||
_(Download unraid-api Logs)_:
|
||||
: <unraid-i18n-host><unraid-download-api-logs></unraid-download-api-logs></unraid-i18n-host>
|
||||
</div>
|
||||
<unraid-i18n-host><unraid-connect-settings></unraid-connect-settings></unraid-i18n-host>
|
||||
<!-- end unraid-api section -->
|
||||
|
||||
Reference in New Issue
Block a user