Commit Graph

24 Commits

Author SHA1 Message Date
Eli Bosley 45cda4af80 chore: nunjucks template engine for test pages (#1783) 2025-11-13 11:35:43 -05:00
Eli Bosley 31c41027fc feat: translations now use crowdin (translate.unraid.net) (#1739)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- App-wide internationalization: dynamic locale detection/loading, many
new locale bundles, and CLI helpers to extract/sort translation keys.

- **Accessibility**
  - Brand button supports keyboard activation (Enter/Space).

- **Documentation**
  - Internationalization guidance added to API and Web READMEs.

- **Refactor**
- UI updated to use centralized i18n keys and a unified locale loading
approach.

- **Tests**
  - Test utilities updated to support i18n and localized assertions.

- **Chores**
- Crowdin config and i18n scripts added; runtime locale exposed for
selection.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-10-13 16:56:08 -04:00
Eli Bosley 77cfc07dda refactor: enhance CSS structure with @layer for component styles (#1660)
- Introduced @layer directive to ensure base styles have lower priority
than Tailwind utilities.
- Organized CSS resets for box-sizing, figures, headings, paragraphs,
and unordered lists under a single @layer base block for improved
maintainability.

These changes streamline the CSS structure and enhance compatibility
with Tailwind CSS utilities.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- Style
- Wrapped core resets in a base style layer, adjusting cascade with
utility classes.
  - Applied global box-sizing within the base layer.
  - Consolidated heading and paragraph resets into the layer.
- Added a reset for unordered lists to remove default bullets and
padding.
  - Retained the logo figure reset within the layer.
- Updated formatting and header comments to reflect the layering
approach.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-09-04 14:36:25 -04:00
Eli Bosley 88087d5201 feat: mount vue apps, not web components (#1639)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Standalone web bundle with auto-mount utilities and a self-contained
test page.
* New responsive modal components for consistent mobile/desktop dialogs.
  * Header actions to copy OS/API versions.

* **Improvements**
* Refreshed UI styles (muted borders), accessibility and animation
refinements.
  * Theming updates and Tailwind v4–aligned, component-scoped styles.
  * Runtime GraphQL endpoint override and CSRF header support.

* **Bug Fixes**
* Safer network fetching and improved manifest/asset loading with
duplicate protection.

* **Tests/Chores**
* Parallel plugin tests, new extractor test suite, and updated
build/test scripts.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-09-03 15:42:21 -04:00
Eli Bosley c7c3bb57ea fix: update OIDC URL validation and add tests (#1646)
- Updated the OIDC issuer URL validation to prevent trailing slashes and
whitespace.
- Introduced a utility class `OidcUrlPatterns` for managing URL patterns
and validation logic.
- Added comprehensive tests for the new URL validation logic and
examples to ensure correctness.
- Bumped version to 4.18.1 in the configuration file.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- New Features
- Added strict validation for OIDC issuer URLs in the SSO configuration
form, with clearer guidance to avoid trailing slashes.
- Bug Fixes
- Prevented misconfiguration by rejecting issuer URLs with trailing
slashes (e.g., Google issuer), avoiding double slashes in discovery
URLs.
- Tests
- Introduced comprehensive unit tests covering issuer URL validation,
patterns, and real-world scenarios to ensure reliability.
- Chores
  - Bumped version to 4.18.1.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-09-03 11:56:30 -04:00
Eli Bosley 0fe2c2c1c8 fix: OIDC and API Key management issues (#1642) 2025-09-03 09:47:11 -04:00
Eli Bosley 4e945f5f56 feat(api): enhance OIDC redirect URI handling in service and tests (#1618)
- Updated `getRedirectUri` method in `OidcAuthService` to handle various
edge cases for redirect URIs, including full URIs, malformed URLs, and
default ports.
- Added comprehensive tests for `OidcAuthService` to validate redirect
URI construction and error handling.
- Modified `RestController` to utilize `redirect_uri` query parameter
for authorization requests.
- Updated frontend components to include `redirect_uri` in authorization
URLs, ensuring correct handling of different protocols and ports.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Stronger OIDC redirect_uri validation and an admin GraphQL endpoint to
view full OIDC configuration.
* OIDC Debug Logs UI (panel, button, modal), enhanced log viewer with
presets/filters, ANSI-colored rendering, and a File Viewer component.
* New GraphQL queries to list and fetch config files; API Config
Download page.

* **Refactor**
* Centralized, modular OIDC flows and safer redirect handling;
topic-based log subscriptions with a watcher manager for scalable live
logs.

* **Documentation**
  * Cache TTL guidance clarified to use milliseconds.

* **Chores**
* Added ansi_up and escape-html deps; improved log formatting; added
root codegen script.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
2025-09-02 10:40:20 -04:00
Eli Bosley 6356f9c41d chore: lint unraid ui (#1638)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- New Features
- Fullscreen dialogs now use dedicated open/close animations for
smoother transitions.

- UX
- Added a “Loading Notifications...” message while notifications are
being fetched.

- Style
- Standardized Tailwind utility class ordering across numerous
components for consistent styling; no functional or visual changes
expected.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-08-29 14:48:14 -04:00
Eli Bosley 674323fd87 feat: generated UI API key management + OAuth-like API Key Flows (#1609)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* API Key Authorization flow with consent screen, callback support, and
a Tools page.
* Schema-driven API Key creation UI with permission presets, templates,
and Developer Authorization Link.
* Effective Permissions preview and a new multi-select permission
control.

* **UI Improvements**
* Mask/toggle API keys, copy-to-clipboard with toasts, improved select
labels, new label styles, tab wrapping, and accordionized color
controls.

* **Documentation**
  * Public guide for the API Key authorization flow and scopes added.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-08-27 12:37:39 -04:00
Eli Bosley 979a267bc5 feat: implement OIDC provider management in GraphQL API (#1563)
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
2025-08-15 11:59:21 -04:00
Pujit Mehrotra 9dfdb8dce7 fix: make settings grid responsive (#1463)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Introduced a new SettingsGrid component for consistent and responsive
grid layouts.

* **Refactor**
* Updated settings-related layouts to use the new SettingsGrid
component, improving maintainability and visual consistency across the
interface.

* **Chores**
  * Removed an unused CSS breakpoint variable from global styles.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-07-22 09:21:35 -04:00
Eli Bosley 2c62e0ad09 feat: tailwind v4 (#1522)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Streamlined Tailwind CSS integration using Vite plugin, eliminating
the need for separate Tailwind config files.
* Updated theme and color variables for improved consistency and
maintainability.

* **Style**
* Standardized spacing, sizing, and font classes across all components
using Tailwind’s default scale.
* Reduced excessive gaps, padding, and font sizes for a more compact and
cohesive UI.
* Updated gradient, border, and shadow classes to match Tailwind v4
conventions.
* Replaced custom pixel-based classes with Tailwind’s bracketed
arbitrary value syntax where needed.
* Replaced focus outline styles from `outline-none` to `outline-hidden`
for consistent focus handling.
* Updated flex shrink/grow utility classes to use newer shorthand forms.
* Converted several component templates to use self-closing tags for
cleaner markup.
  * Adjusted icon sizes and spacing for improved visual balance.

* **Chores**
* Removed legacy Tailwind/PostCSS configuration files and related
scripts.
* Updated and cleaned up package dependencies for Tailwind v4 and
related plugins.
  * Removed unused or redundant build scripts and configuration exports.
  * Updated documentation to reflect new Tailwind v4 usage.
  * Removed Prettier Tailwind plugin from formatting configurations.
* Removed Nuxt Tailwind module in favor of direct Vite plugin
integration.
  * Cleaned up ESLint config by removing Prettier integration.

* **Bug Fixes**
  * Corrected invalid or outdated Tailwind class names and syntax.
* Fixed issues with max-width and other utility classes for improved
layout consistency.

* **Tests**
* Updated test assertions to match new class names and styling
conventions.

* **Documentation**
* Revised README and internal notes to clarify Tailwind v4 adoption and
configuration changes.
* Added new development notes emphasizing Tailwind v4 usage and
documentation references.

* **UI Components**
* Enhanced BrandButton stories with detailed variant, size, and padding
showcases for better visual testing.
* Improved theme store to apply dark mode class on both `<html>` and
`<body>` elements for compatibility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-07-21 09:58:02 -04:00
Eli Bosley 345e83bfb0 feat: upgrade nuxt-custom-elements (#1461)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Added new modal dialogs and UI components, including activation steps,
OS update feedback, and expanded notification management.
* Introduced a plugin to configure internationalization, state
management, and Apollo client support in web components.
* Added a new Log Viewer page with a streamlined interface for viewing
logs.

* **Improvements**
* Centralized Pinia state management by consolidating all stores to use
a shared global Pinia instance.
* Simplified component templates by removing redundant
internationalization host wrappers.
* Enhanced ESLint configuration with stricter rules and global variable
declarations.
* Refined custom element build process to prevent jQuery conflicts and
optimize minification.
* Updated component imports and templates for consistent structure and
maintainability.
* Streamlined log viewer dropdowns using simplified select components
with improved formatting.
* Improved notification sidebar with filtering by importance and modular
components.
* Replaced legacy notification popups with new UI components and added
automatic root session creation for localhost requests.
* Updated OS version display and user profile UI with refined styling
and component usage.

* **Bug Fixes**
* Fixed component tag capitalization and improved type annotations
across components.

* **Chores**
* Updated development dependencies including ESLint plugins and build
tools.
* Removed deprecated log viewer patch class and cleaned up related test
fixtures.
  * Removed unused imports and simplified Apollo client setup.
* Cleaned up test mocks and removed obsolete i18n host component tests.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---
- To see the specific tasks where the Asana app for GitHub is being
used, see below:
  - https://app.asana.com/0/0/1210730229632804

---------

Co-authored-by: Pujit Mehrotra <pujit@lime-technology.com>
Co-authored-by: Zack Spear <zackspear@users.noreply.github.com>
2025-07-08 10:05:39 -04:00
Michael Datelle 711cc9ac92 feat: build out docker components (#1427)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Introduced comprehensive, customizable Accordion, Dialog,
DropdownMenu, and Select UI components with enhanced prop-driven and
slot-based APIs.
* Added grouped exports for UI primitives, simplifying imports and
usage.
* Added new Storybook stories demonstrating varied usage scenarios for
Accordion, Dialog, DropdownMenu, and Select components.

* **Refactor**
* Replaced external UI dependencies with locally defined, typed
components for Accordion, Dialog, DropdownMenu, and Select.
* Streamlined component APIs by consolidating exports to main components
and type exports, removing subcomponent exports.
* Simplified dialog and dropdown menu implementations with explicit
props, events, and slots.
* Updated component styles and class bindings for improved appearance
and interaction.
* Refined select component into a fully featured, typed implementation
supporting grouping and multiple selection.
* Replaced custom dropdown menu implementation in user profile with the
new DropdownMenu component.
* Simplified internal prop forwarding using reactive utilities for
dropdown menu and select subcomponents.
* Improved dropdown menu stories with declarative props and slots,
removing manual subcomponent composition.
* Simplified notification filter UI by replacing nested select
subcomponents with a declarative items prop.

* **Bug Fixes**
* Improved dropdown and select item handling, including disabled states,
separators, and grouped options.

* **Style**
* Enhanced visual consistency and spacing in documentation and UI
components.
  * Updated component classes for better appearance and usability.

* **Chores**
* Upgraded `@jsonforms` dependencies across all packages to version
`^3.6.0`.
  * Improved test and mock setups for new component structures.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: mdatelle <mike@datelle.net>
Co-authored-by: Eli Bosley <ekbosley@gmail.com>
2025-07-03 16:40:06 -04:00
Pujit Mehrotra 70c790ff89 fix: alignment of settings on ManagementAccess settings page (#1421)
## Summary by CodeRabbit

- **Refactor**
- Removed description text display from a form field for a cleaner
interface.
- Enhanced form field matching to better target specific string array
inputs.
- Updated remote access settings UI for clearer layout and separation of
title and details.
  - Adjusted label container styling to allow more flexible width.
- Improved grouping of precondition information for better visual
structure.
  - Added a colon to the SSO users settings label for consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---
- To see the specific tasks where the Asana app for GitHub is being
used, see below:
  - https://app.asana.com/0/0/1210572375587668
2025-06-19 08:46:18 -04:00
Pujit Mehrotra c132f28281 chore: extract connect to an API plugin (#1367)
separates Unraid Connect from the API

## Summary by CodeRabbit

- **New Features**
- Introduced a unified, JSON-schema-based settings system for API
configuration and plugin settings, accessible via new GraphQL queries
and mutations.
- Added modular NestJS plugin architecture for Unraid Connect, including
new modules for cloud, remote access, and system/network management.
- Added granular connection and remote access state tracking, with new
GraphQL types and resolvers for cloud and connection status.
- Implemented event-driven and service-based management for SSO users,
API keys, and dynamic remote access.
- Enhanced UI components and queries to support unified settings and
restart detection.

- **Improvements**
- Refactored configuration and state management to use service-based
patterns, replacing direct store access and Redux logic.
- Migrated legacy config files to new JSON formats with validation and
persistence helpers.
- Centralized global dependencies and shared services for plugins and
CLI modules.
- Improved logging, error handling, and lifecycle management for
connections and background jobs.
- Updated and expanded documentation for plugin development and settings
management.

- **Bug Fixes**
- Improved handling of missing config files and ensured safe
persistence.
- Enhanced error reporting and validation in remote access and
connection services.

- **Removals**
- Removed deprecated Redux slices, listeners, and legacy cloud/remote
access logic.
- Deleted obsolete test files, scripts, and unused code related to the
old state/store approach.

- **Tests**
- Added new unit tests for settings merging, URL resolution, and cloud
connectivity checks.

- **Style**
- Applied consistent formatting, import reorganization, and code style
improvements across modules.

- **Chores**
- Updated build scripts, Dockerfiles, and development environment setup
to support new dependencies and workflows.
- Expanded .gitignore and configuration files for improved build
artifact management.
2025-06-10 15:16:26 -04:00
Eli Bosley 5517e7506b feat: add rclone (#1362)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Introduced full RClone remote management with creation, deletion,
listing, and detailed remote info via a multi-step, schema-driven UI.
- Added guided configuration forms supporting advanced and
provider-specific options for RClone remotes.
  - Enabled flash backup initiation through API mutations.
- Added new Vue components for RClone configuration, overview, remote
item cards, and flash backup page.
- Integrated new combobox, stepped layout, control wrapper, label
renderer, and improved form renderers with enhanced validation and error
display.
- Added JSON Forms visibility composable and Unraid settings layout for
consistent UI rendering.

- **Bug Fixes**
- Standardized JSON scalar usage in Docker-related types, replacing
`JSONObject` with `JSON`.

- **Chores**
- Added utility scripts and helpers to manage rclone binary installation
and versioning.
- Updated build scripts and Storybook configuration for CSS handling and
improved developer workflow.
- Refactored ESLint config for modularity and enhanced code quality
enforcement.
- Improved component registration with runtime type checks and error
handling.

- **Documentation**
- Added extensive test coverage for RClone API service, JSON Forms
schema merging, and provider config slice generation.

- **Style**
- Improved UI consistency with new layouts, tooltips on select options,
password visibility toggles, and error handling components.
- Removed deprecated components and consolidated renderer registrations
for JSON Forms.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
2025-05-27 07:52:25 -04:00
Eli Bosley da8dac3940 chore: add linter to unraid ui and simplify tsconfigs (#1308)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **Chores**
- Introduced a linting step in the build process to enhance code
quality.
- Updated configuration settings with a version upgrade and adjustments
to network port specifications.
- Refined package and TypeScript configurations for improved module
resolution and maintainability.

- **Style**
- Standardized code formatting with consistent quotation usage,
semicolon additions, and reorganized import paths for clarity.
- Enhanced readability of SVG markup and component templates through
formatting adjustments.
- Simplified property definitions and improved code organization within
components for better readability.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2025-04-03 15:31:11 -04:00
Pujit Mehrotra 5ba3fa67a2 feat: add gui settings field for sso users (#1310)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Bulk SSO account management is now supported, allowing users to update
multiple SSO account IDs at once.
- Connect settings now include SSO account identifiers for streamlined
configuration.
- Expanded array management functionality introduces advanced operations
for managing disk arrays.
- New fields for SSO user IDs have been added to various settings and
queries.

- **Style & Documentation**
- Improved formatting and support for rich HTML in form descriptions
enhance clarity and presentation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Eli Bosley <ekbosley@gmail.com>
2025-04-03 09:50:12 -04:00
Eli Bosley 7a421ce4ec chore: fix dev console and allowed-headers 2025-04-02 11:28:21 -04:00
Michael Datelle b0099421f3 refactor: swap out radix with reka (#1271)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **Refactor**
- Improved type safety and consistency across UI components by
leveraging centralized type definitions.

- **Chores**
- Updated and consolidated UI component dependencies by migrating from a
previous library to a new one and refining package configurations.

- **Style**
- Standardized code formatting for uniform syntax and improved
readability.

- **Tests**
- Expanded testing configuration to include additional file types for
enhanced test coverage.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: mdatelle <mike@datelle.net>
2025-03-26 14:56:43 -04:00
Michael Datelle a1d02b486a refactor: swap out dropdown with reka components (#1245)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Introduced a new `DropdownMenu` component in user profiles with
dynamic content rendering.
- Added a new `Popover` component with interactive Storybook demos,
improving component discoverability.
- Added a new `DropdownMenuArrow` component to enhance dropdown visuals.
- Implemented new CSS custom properties for charts, enhancing styling
capabilities in light and dark themes.
- Enhanced dropdown functionality by encapsulating dropdown logic in a
new `UpcDropdownMenu` component.
- Added a new `Select` component for improved user interaction within
the `Sheet` component.
- Introduced a new `SheetWithSelect` story to showcase selection
functionality within the `Sheet` component.
- Updated the `Sidebar` component to improve modal behavior and content
positioning.
- Enhanced `UserProfile` components with a new feedback function for
better status indication.

- **Style**
- Refined layouts by replacing fixed widths with flexible, responsive
designs.
- Updated global styling with a refreshed chart color palette and
expanded dark mode support.

- **Refactor**
- Migrated components to use a unified UI library, streamlining
interactions and boosting consistency.
- Improved type safety in `BrandLoading` component by utilizing a new
type for variants and sizes.
- Updated component imports and organization to enhance maintainability.

- **Bug Fixes**
- Removed unused promotional code and components, simplifying the
codebase and improving performance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: mdatelle <mike@datelle.net>
Co-authored-by: Zack Spear <hi@zackspear.com>
Co-authored-by: Eli Bosley <ekbosley@gmail.com>
2025-03-24 17:24:52 -04:00
Pujit Mehrotra a4f69dc539 restart when developer sandbox is toggled (#1232)
When the sandbox is toggled via api, the api now restarts after a 3 second delay. The Connect settings UI also informs users, when applicable, that the api will restart before and after they apply their settings.

## Summary by CodeRabbit

- **New Features**
- Improved deployment commands now allow specifying a target server,
streamlining the deployment process.
- Enhanced settings synchronization provides clear feedback on when a
system restart is required after updates.
- Automatic service restart is now triggered after applying connection
settings changes.
- User interface enhancements include added contextual descriptions for
toggle controls.
- New functionality to refetch connection settings after updates,
providing users with the latest information.

- **Bug Fixes**
- Improved user feedback regarding API restart status after settings
updates.
2025-03-18 10:33:09 -04:00
Pujit Mehrotra acbf46df3f 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.
2025-03-17 10:26:07 -04:00