Commit Graph

1089 Commits

Author SHA1 Message Date
Christoph Heiss
d62ef2a856 network edit: add tooltip to bridge ports inputs
.. as the exact format it takes might not be immediately obvious to
users.

Signed-off-by: Christoph Heiss <c.heiss@proxmox.com>
2023-03-21 13:34:31 +01:00
Thomas Lamprecht
7996ce875c bump version to 3.6.1
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-03-20 14:13:46 +01:00
Stefan Sterz
2c837f5766 dark-theme: let the background "shine through" mask more
this makes the background mask a bit brighter and more see-through to
make it possible to read values from behind the mask, if needed. it
also adds a more visible shadow to windows so that the stand out more
at the same time.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-20 14:05:20 +01:00
Stefan Sterz
9c2ccd1aa4 dark-theme: dim warning and invalid colors more
this brings them more in-line with the appearance of crisp.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-20 14:05:20 +01:00
Stefan Sterz
b20a650bcc dark-theme: make "sorted-by" header highlight more subtle
by making the highlight more subtle, the theme is more consistent with
the look of crisp.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-20 14:05:20 +01:00
Stefan Sterz
437af70685 dark-theme: improve help button contrast ratios in focused state
also improves the hovered/focused state and makes it more consistent
with other buttons by making it brighter than the default state.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-20 14:05:20 +01:00
Lukas Wagner
bfb750a564 auth ui: fix value not defined in enumeration error
...when editing LDAP realm sync settings and only a single property is
empty and thus to be deleted (e.g. values.delete = "filter").

If `delete` is a simple string and not an array,
`Proxmox.Utils.delete_if_default` simply creates a comma-separated list,
(e.g. value.delete = "filter,sync-attributes").

When the properties from the other panel are evaluated and added to the
the `delete` property, comma-separated list format is not considered,
leading to a final value for `delete` that could look like this:
  value.delete = {
    "server2",
    "comment",
    "filter,sync-attributes"
  }

This commit fixes this by splitting `delete` in case it is a string.

Reported-by: Friedrich Weber <f.weber@proxmox.com>
Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
2023-03-17 16:41:59 +01:00
Lukas Wagner
78970361b3 auth ui: add firstname and lastname sync-attribute fields
This allows the user to set up a mapping for `firstname` and `lastname`
attributes for LDAP user syncs.

Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
2023-03-17 16:41:59 +01:00
Lukas Wagner
2ee8cbdac1 auth ui: add onlineHelp for AuthEditLDAP
Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
2023-03-17 16:41:59 +01:00
Lukas Wagner
d6b65a89ce auth ui: add LDAP sync UI
Taken and adapted from PVE.
Changes:
  - Removed fields that are irrelevant for PBS for now (PBS has no
    groups yet). If PVE is adapted to use the implementation from the
    widget toolkit, the fields can simply be readded and somehow
    feature-gated so that the fields are only visible/editable on PVE

Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
2023-03-17 16:41:59 +01:00
Lukas Wagner
aa5cbdbb32 auth ui: add LDAP realm edit panel
The panel was mostly taken from from PVE, but altered slightly:
  - bind-dn and bind-password are displayed under "General"
    and not under "Sync". For some servers, we need to be bound
    to lookup a user's domain from a given user id attribute.
    In PVE, the bind-dn and bind-password fields are under
    "Sync", which is a bit confusing if a user is not interested
    in automatic user syncing.

  - There is a 'anonymous search' checkbox. The value is not persisted
    in the configuration, it merely enables/disables the
    bind-dn and bind-password fiels to make their intent a bit more
    clear.

  - Instead of a 'secure' checkbox, a combobox for TLS mode is shown.
    This way users can select between LDAP, STARTLS and LDAPS.
    In PVE, the 'secure' config parameter is deprecated anyway, so
    I took the opportunity to replace it with the 'mode' parameter
    as described.

  - Parameters now consistently use kebab-case for naming. If
    PVE is modified to use the same panel, some sort of adapter
    will be needed.

Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
2023-03-17 16:41:59 +01:00
Lukas Wagner
64f65c027d repo view: replace non-clickable checkbox with icons
From a usability view, having a checkbox that is not clickable is pretty
misleading, especially if the visual style is exactly the same as in
other places in the UI where the checkbox is functional.

Signed-off-by: Lukas Wagner <l.wagner@proxmox.com>
2023-03-17 11:27:38 +01:00
Thomas Lamprecht
dde1f3b094 bump version to 3.6.0
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-03-14 16:25:41 +01:00
Dominik Csapak
a1177796f9 auth-realm selector: add custom store filters for callers
so that a user can filter the underlying store, e.g. for type

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-03-14 15:25:27 +01:00
Stefan Sterz
3501ca3fc9 dark-theme: increase contrast on check-boxes
by adding a bit of brightness to the icons they stand out a bit more,
especially when selected but not active (grey check-mark)

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-14 15:13:35 +01:00
Stefan Sterz
a017567bd8 utils: move to using the auto theme per default
make the new default theme the "auto" theme that uses media queries to
detect a users preferred theme.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-14 15:13:35 +01:00
Stefan Sterz
e8b405f770 dark-theme: visually remove the border around the pve resource tree
by setting the color of the border of the resource tree to the panel
background color, it doesn't appear visually anymore while keeping
alignments in place.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-11 17:50:32 +01:00
Stefan Sterz
0cdf266659 dark-theme: remove thicker borders around content
previously the dark theme used thicker borders in certain places to
space out the content a bit more. this removes them again to make the
appearance more consistent with "crisp".

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-11 17:50:32 +01:00
Stefan Sterz
2a5b7cd2ff dark-theme: re-work buttons colors to appear dimmer
this dims buttons further by removing pure white text color and
adjusting backgrounds and border accordingly. it also keeps the help
buttons brighter than other buttons to draw (possibly confused) users
to them.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-11 17:50:32 +01:00
Stefan Sterz
e48bb85042 dark-theme: make windows stand out more against the background mask
makes the background mask darker so windows stand out a bit more

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-11 17:50:32 +01:00
Stefan Sterz
928df9ff32 dark-theme: fix summary row background
previously an "!important" was missing from the `background-color`
property. this meant that the background color wasn't properly
overridden. the "!important" is necessary as it is also used in the
light theme.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-11 17:50:32 +01:00
Dominik Csapak
b2471e89d0 input panel: improve validity change check for advanced fields
instead of only checking the validity of the advanced items when the
form validity changed as a whole, add a validity change listener to
each field in the advanced section.

This improves the behaviour such that every time an advanced field
gets invalid the items are show, not only when the form was valid
before.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Tested-By: Aaron Lauterer <a.lauterer@proxmox.com>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-03-11 17:32:15 +01:00
Alexandre Derumier
0c50257362 fix #4585 : toolkit: configid type: add missing "-" character support
JsonSchema is already ok:
$CONFIGID_RE = qr/[a-z][a-z0-9_-]+/i;

This is blocking creation of snapshot name with "-" in gui.
(works fine command line)

Signed-off-by: Alexandre Derumier <aderumier@odiso.com>
2023-03-11 17:29:16 +01:00
Stefan Sterz
8d32419234 dark-theme: add support for the pmg quarantine theme toggle
allows using the theme toggle in the pmg quarantine properly. adds a
filter over the iframes in the quarantine to make them appear properly
in a dark environment.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-08 17:49:20 +01:00
Daniel Tschlatscher
15fddc20d1 util/window/form: add a theme selector
add a widget that implements a theme selector and sets a cookie to
load the appropriate theme.

Co-authored-by: Daniel Tschlatscher <d.tschlatscher@proxmox.com>
Co-authored-by: Stefan Sterz <s.sterz@proxmox.com>
Signed-off-by: Daniel Tschlatscher <d.tschlatscher@proxmox.com>
Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-08 17:49:20 +01:00
Stefan Sterz
c5559f82ea rrd chart: add support for the dark theme and dynamic theme switching
by integrating the theme switching logic into the chart panel itself,
themes can be switched more responsively based on css variables.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-08 17:49:20 +01:00
Stefan Sterz
f111efa4fd gauge widget: add support for a dark theme and dynamic theme switching
the gauges in the data center overview should use a dark style if the
relevant css variables are set. this also makes it possible to switch
the colors dynamically by adding an event listener

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-08 17:49:20 +01:00
Stefan Sterz
fbe9ee7210 subscription/summary/backup: stop setting the background color
setting the background color in js code adds that property as a style
attribute to the element. that makes it hard to alter later via css
and makes it hard to dynamically change the color e.g., if we want to
add different themes. the background color for these elements are
white already anyway, so just remove them here.

Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-08 17:49:19 +01:00
Daniel Tschlatscher
6bf5e1256e dark-theme: add initial version of the proxmox-dark theme
adds an initial version of a dark theme for all proxmox products. the
theme works by simply loading an additional css file that adjust the
colors of the original theme "crisp" to be more suitable for a dark
theme.

the theme itself is written in scss, so we need to add sassc as a
build dependency. while sassc is deprecated, it is still maintained in
the debian repositories and, thus, needs no additional packaging on
our end.

this version adds the following on-top of Daniel Tschlatscher's
original draft:

* removes checked-in build artifacts and other stuff that shouldn't be
  tracked
* code clean-up and removal of redundant code
* refactors:
    * icon styling
    * color handling for charts (moved to css variables)
    * color variables, consolidates them and makes the "functional"
    * color values, improves contrast and makes the theme appear more
      consistent
    * using the "theme-" prefix
* adds:
    * markdown note styles
    * combo-box trigger styles
    * even more icon styles (e.g., template icons, check boxes etc.)
    * loading spinners styles
    * number field up and down arrow styles
    * an additional auto theme that switches between light and dark
      theme dynamically
    * widget toolkit hints
    * ceph install mask
    * grid group headers
    * color to toggled buttons
    * date picker styles
    * drag and drop proxy styles
* fixes:
    * contrast on control elements for "scrollable" sidebars
    * make the general appearance closer to the light theme ("crisp")
    * buttons (when hovered, toggled etc)
    * background masking (e.g., when showing the log-in form)
    * grid header separator (adds an outline)
    * separator lines in some menus
    * makes the custom unknown icon more discernible
    * makes headers more readable
    * color adjustments to several components for consistency
    * reduces brightness of dividers in toolbars
    * border color on chart legend elements
    * removes a black border from docked toolbars (e.g., tag edit)
    * dims the "invalid" color to appear less aggressive
    * add hover effects in grids and make them consistent with "crisp"
    * summary rows
    * selected and hovered elements in boundlists
    * row numberers in grids
    * contrast of links in hints
    * ceph overview border colors (e.g., OSD in/out/up/down grid)
    * bottom splitter contrast in certain situations
    * tag visibility
    * pbs compatibility (help buttons stylings, icons, tabs)
    * pmg compatibility:
         * remove border around the spanning element in the header
         * style spam score grid
         * style tracking center rows
         * add appropriate colors to buttons in the quarantine
         * style mail-info element in the quarantine

Co-authored-by: Daniel Tschlatscher <d.tschlatscher@proxmox.com>
Co-authored-by: Stefan Sterz <s.sterz@proxmox.com>
Signed-off-by: Daniel Tschlatscher <d.tschlatscher@proxmox.com>
Signed-off-by: Stefan Sterz <s.sterz@proxmox.com>
2023-03-08 17:49:19 +01:00
Matthias Heiserer
7e66b73ce4 ui: SMART: fix eslint error / show correct value
Signed-off-by: Matthias Heiserer <m.heiserer@proxmox.com>
2023-03-08 17:49:19 +01:00
Friedrich Weber
51083ee54a fix #4421: ui: guard setProxy against races of slow vs fast requests
Some UI components use `Ext.data.Store.setProxy` to change their
associated API endpoint URL in reaction to user input. One example is
`BackupView`, which calls `setProxy` when the user switches from
listing backups on storage A to listing backups on storage B. However,
if A is slow, the UI may receive the response for A *after* the
response for B. It will then display the contents of A as if they were
the contents of B, resulting in a UI inconsistency.

The reason is that `Ext.data.Store` still processes the slow response
for A, even though it is obsolete. This patch overrides the
responsible callback of `Ext.data.Store` to only process responses
belonging to the currently active proxy object. This should rule out
similar race conditions in all components that use the `setProxy` API.
In the above example, the patch results in the response for A being
ignored.

Ignored responses are logged to the browser console.

Note that this patch only concerns components that use `setProxy` for
changing API endpoints. Other components (e.g. those using
`proxy.setURL` for the same purpose) may be open to similar race
conditions.

Link: https://lists.proxmox.com/pipermail/pve-devel/2023-March/056062.html
Signed-off-by: Friedrich Weber <f.weber@proxmox.com>
2023-03-08 07:42:11 +01:00
Thomas Lamprecht
c16785f66a apt: use justified flex box for empty text hint
avoid some overly long/nested divs

Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-02-14 11:45:41 +01:00
Matthias Heiserer
aacb9ea12a ui: SMART: show SMART data in correct columns
Signed-off-by: Matthias Heiserer <m.heiserer@proxmox.com>
2023-02-14 10:48:40 +01:00
Thomas Lamprecht
f372d3c087 node apt: make changelog window taller for 4:3 ratio
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-02-01 12:15:36 +01:00
Thomas Lamprecht
261f558105 node apt: cleanup and modernize code
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-02-01 12:14:22 +01:00
Thomas Lamprecht
7f14a081af bump version to 3.5.5
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-31 17:31:31 +01:00
Thomas Lamprecht
6b70ca845d form: display-edit: add safe default renderer for display field
Due to the value binding on can get interesting effects when the
displayEdit field is in write (input) mode, as then the values still
get relayed to the display field, which itself is wanted as the field
supports live-switching, but even though the display field is
disabled and hidden, the value will be still rendered and a user can
XSS themselves inserting things like:
<img src="a" onerror="alert('cookie:'+document.cookie);"></token

And even though it's harmless (your browser knows your own cookie
already), it is rather odd and simply to cheap to harden against (per
default) to not do so.

Reported-by: Marcel Fromkorth <marcel.fromkorth@8com.de>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-31 17:21:13 +01:00
Thomas Lamprecht
319d450bec api request: add wide spread alert-error logic as smart-on option
The "smartness" is mostly "enable it automatically if the caller did
not specify an explicit override and there's neither a failure nor
callback function define", but that should cover most cases.

Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-31 15:56:27 +01:00
Thomas Lamprecht
cf93d1da50 utils: always html-encode response message
while this is something that only the user that made the request will
see, and for most people the possibility of "hacking" themselves is
rather redundant, it is still not nice to have this possible in
general; as even if it's highly unlikely that there ever can be an
error triggered to another user via API2 request handling, hardening
against it is simply to cheap to not do it.

Reported-by: Marcel Fromkorth <marcel.fromkorth@8com.de>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-31 15:41:42 +01:00
Thomas Lamprecht
d53046d66b utils: code cleanup for extractRequestError
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-31 15:34:31 +01:00
Dominik Csapak
4a819c891e combobox grid: avoid needing two clicks after re-selecting an item
'picker.hide()' hides the picker, but does not do everything to
properly keep track of the picker state in the combobox class.

This lead to a bug when we reselected an entry, we had to click the
picker again twice to open it again.

Use the 'collapse' method of the combobox instead, which does the
necessary book-keeping.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
2023-01-31 10:34:47 +01:00
Dominik Csapak
c071b0c302 ComboGrid: make height for the error configurable
by introducing a errorHeight config property. This is necessary when
the ComboGrid has e.g. a toolbar and we show the error in the grid body
only, 100 pixels is not enough then. To solve that without hardcoding
different heights, let the subclass/caller configure that

also set this when the store load fails completely (was not done until now)

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
2023-01-18 15:13:37 +01:00
Dominik Csapak
aa157deb47 ComboGrid: use the grids view for the error message
for most of the combogrids, this does not make a difference, but we
want to have a node selection in some of their toolbars. There
having the error over the whole grid makes it impossible to select a
different node (which might be necessary to get rid of the error), so
we show the error on the view (which is the grids content body only).

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
2023-01-18 15:13:37 +01:00
Thomas Lamprecht
49dd139a34 bump version to 3.5.4
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 16:09:56 +01:00
Thomas Lamprecht
f6efb0d487 node network view: move add-menu generation to common helper
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 16:03:45 +01:00
Thomas Lamprecht
bcd21f899e node network view: rework finding free interface ID
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 15:18:10 +01:00
Thomas Lamprecht
13220ad1f5 node network view: code style modernization
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 15:13:33 +01:00
Thomas Lamprecht
8407542364 role selector: make slightly more wide and resizeable
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 15:09:25 +01:00
Thomas Lamprecht
7b8eff314a task viewer: modernize code style
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 14:43:33 +01:00
Thomas Lamprecht
ba4ab7663d code style: use arrow fn for some api request failure paths
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-01-11 14:42:33 +01:00