add pro readonly + enhance words break

This commit is contained in:
Jordan Blasenhauer 2024-05-06 11:23:12 +02:00
parent aa0e7620c4
commit f2a0cbadbd
9 changed files with 18 additions and 14 deletions

View file

@ -15,6 +15,7 @@
- [UI] General : fix select setting crop because of overflow and check if select is out of viewport to determine visible position
- [UI] General : show logs on UI when pre rendering issue
- [UI] General : Improve UI performance by using multiple workers for the web server and reducing the number of times we prompt a loading page
- [UI] General : handle word breaks on dynamic text content
- [UI] Global config : fix script error while fragment relate to a missing plugin
- [UI] Global config / services page : filtering settings now open plugin select to highlight remaining plugin
- [UI] Global config / services page : add combobox on plugin select open to search a plugin quick

File diff suppressed because one or more lines are too long

View file

@ -159,7 +159,7 @@
}
.settings-tabs-select-btn-svg {
@apply ml-4 min-w-fit transition-transform h-4 w-4 fill-primary dark:fill-gray-300;
@apply ml-4 min-w-[1rem] transition-transform h-4 w-4 fill-primary dark:fill-gray-300;
}
.active.settings-tabs-select-dropdown-btn {

View file

@ -16,10 +16,10 @@
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
<input type="hidden" name="INSTANCE_ID" value="{{ instance._id }}" />
<!-- state and title-->
<div class="grid grid-cols-12">
{% if instance.health %}<div class="col-span-1 mt-2 h-4 w-4 rounded-full bg-green-500"></div>{% endif %}
{% if not instance.health %}<div class="col-span-1 mt-2 h-4 w-4 rounded-full bg-red-500"></div>{% endif %}
<h5 class="col-span-11 break-words font-bold dark:text-white/90 transition duration-300 ease-in-out">
<div class="flex justify-start items-start overflow-hidden">
{% if instance.health %}<div class="min-w-4 mr-2 mt-2 h-4 w-4 rounded-full bg-green-500"></div>{% endif %}
{% if not instance.health %}<div class="min-w-4 mr-2 mt-2 h-4 w-4 rounded-full bg-red-500"></div>{% endif %}
<h5 class="break-words font-bold dark:text-white/90 transition duration-300 ease-in-out">
{{ instance.name }}
</h5>
</div>

View file

@ -31,7 +31,7 @@
</span>
<!-- chevron -->
<svg data-{{attribute_name}}-setting-select="instances"
class="min-w-fit ml-2 transition-transform h-4 w-4 fill-gray-500"
class="min-w-4 ml-2 transition-transform h-4 w-4 fill-gray-500"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512">
<path d="M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z" />

View file

@ -8,6 +8,7 @@
{% set inp_value = setting_input['value'] %}
{% set global_config_method = global_config.get(inp_name, {'method' : inp_method }).get('method') %}
{% set global_config_value = global_config.get(inp_name, {'value' : inp_value }).get('value') %}
{% set is_read_only = True if setting_input['is_pro_plugin'] and not is_pro_version else False %}
<div data-checkbox-handler="{{ inp_id }}"
class="relative mb-7 md:mb-0 z-10 ">
@ -16,9 +17,9 @@
name="{{ inp_name_mult }}"
data-default-method="{% if inp_name in ['AUTOCONF_MODE', 'SWARM_MODE', 'KUBERNETES_MODE'] %}mode{% else %}{{ global_config_method }}{% endif %}"
data-default-value="{{ global_config[inp_name]['value'] }}"
{% if inp_name in ['AUTOCONF_MODE', 'SWARM_MODE', 'KUBERNETES_MODE'] or global_config_method != 'ui' and global_config_method != 'default' %} disabled {% endif %}
{% if inp_name in ['AUTOCONF_MODE', 'SWARM_MODE', 'KUBERNETES_MODE'] or global_config_method != 'ui' and global_config_method != 'default' or is_read_only %} disabled {% endif %}
data-checked="{% if global_config_value == "yes" %}true{% else %}false{% endif %}"
checked
{% if global_config_value == "yes" %}checked{% endif %}
id="checkbox-{{ inp_id }}"
class="checkbox"
type="checkbox"

View file

@ -9,6 +9,7 @@
{% set inp_regex = setting_input['regex'] %}
{% set global_config_method = global_config.get(inp_name, {'method' : inp_method }).get('method') %}
{% set global_config_value = global_config.get(inp_name, {'value' : inp_value }).get('value') %}
{% set is_read_only = True if setting_input['is_pro_plugin'] and not is_pro_version else False %}
<div class="relative flex items-center">
<label class="sr-only" for="{{ inp_name_mult }}">{{ inp_name }}</label>
@ -16,14 +17,14 @@
data-default-value="{{ global_config_value }}"
data-default-method="{{ global_config_method }}"
data-setting-input
{% if global_config_method != 'ui' and global_config_method != 'default' %}disabled{% endif %}
{% if global_config_method != 'ui' and global_config_method != 'default' or is_read_only %}disabled{% endif %}
id="{{ inp_name_mult }}"
name="{{ inp_name_mult }}"
class="regular-input"
value="{% if global_config_value %} {{ global_config_value }} {% else %} {{ inp_default }} {% endif %}"
type="{{ inp_type }}"
pattern="{{ inp_regex|safe }}"
{% if is_multiple %} data-is-multiple {% endif %}
{% if is_multiple %} data-is-multiple{% endif %}
/>
{% if inp_type == "password" %}
<div data-setting-password-container class="absolute flex right-2 h-5 w-5">

View file

@ -10,6 +10,7 @@
{% set inp_is_simple = setting_input['is_simple'] %}
{% set global_config_method = global_config.get(inp_name, {'method' : inp_method }).get('method') %}
{% set global_config_value = global_config.get(inp_name, {'value' : inp_value }).get('value') %}
{% set is_read_only = True if setting_input['is_pro_plugin'] and not is_pro_version else False %}
<!-- default hidden-->
<select data-default-method="{{ global_config_method }}"
@ -32,7 +33,7 @@
<!-- end default hidden-->
<!--custom-->
<div data-select-container class="relative">
<button {% if global_config_method != 'ui' and global_config_method != 'default' %}disabled{% endif %}
<button {% if global_config_method != 'ui' and global_config_method != 'default' or is_read_only %}disabled{% endif %}
data-setting-select="{{ inp_id }}"
data-default-value="{{ global_config_value }}"
data-default-method="{{ global_config_method }}"

View file

@ -52,7 +52,7 @@
<div data-plugin-settings class="w-full grid grid-cols-12">
<!-- plugin settings not multiple -->
{% for setting, value in plugin["settings"].items() %}
{% set setting_input = { "name" : setting, "context" : value.get("context"), "method" : value.get("method"), "help" : value.get("help"), "label" : value.get("label"), "id" : value.get("id"), "type" : value.get("type"), "default" : value.get("default"), "select" : value.get("select"), "regex" : value.get("regex"), "value" : value.get("value"), "is_multiple" : False, "levels" : value.get('levels', {})} %}
{% set setting_input = { "is_pro_plugin" : True if plugin["type"] == "pro" else False, "name" : setting, "context" : value.get("context"), "method" : value.get("method"), "help" : value.get("help"), "label" : value.get("label"), "id" : value.get("id"), "type" : value.get("type"), "default" : value.get("default"), "select" : value.get("select"), "regex" : value.get("regex"), "value" : value.get("value"), "is_multiple" : False, "levels" : value.get('levels', {})} %}
{% if setting != "IS_DRAFT" and (current_endpoint == "global-config" and setting not in ["SERVER_NAME", "IS_LOADING"] or current_endpoint == "services" and value['context'] == "multisite") %}
{% if value['multiple'] and value['multiple'] not in multList %}
@ -96,7 +96,7 @@
<!-- multiple settings -->
<div data-{{ current_endpoint }}-settings-multiple="{{ multiple }}_SCHEMA" class="bg-gray-50 dark:bg-slate-900/30 hidden w-full my-4 grid-cols-12 border dark:border-gray-700 rounded">
{% for setting, value in plugin["settings"].items() %}
{% set setting_input = { "name" : setting, "context" : value.get("context"), "method" : value.get("method"), "help" : value.get("help"), "label" : value.get("label"), "id" : value.get("id"), "type" : value.get("type"), "default" : value.get("default"), "select" : value.get("select"), "regex" : value.get("regex"), "value" : value.get("value"), "is_multiple" : True, "levels" : value.get('levels', {})} %}
{% set setting_input = { "is_pro_plugin" : True if plugin["type"] == "pro" else False, "name" : setting, "context" : value.get("context"), "method" : value.get("method"), "help" : value.get("help"), "label" : value.get("label"), "id" : value.get("id"), "type" : value.get("type"), "default" : value.get("default"), "select" : value.get("select"), "regex" : value.get("regex"), "value" : value.get("value"), "is_multiple" : True, "levels" : value.get('levels', {})} %}
{# render only setting that match the multiple id and context #}
{% if value['multiple'] == multiple and (