Files
api/web
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
..
2025-01-28 09:12:54 -05:00
2025-02-24 13:42:31 -05:00
2025-01-09 16:06:10 -05:00

connect-components via Nuxt 3

Install dependencies

npm i

Dev testing and builds with .env setup

There's 3 version required for various types of development, testing builds in the Unraid webgui, and creating a prod build for the Unraid webgui.

  • .env for npm run dev local development
  • .env.staging for npm run build:dev which tests builds in the Unraid webgui
  • .env.production for npm run build:webgui which does a production build for the Unraid webgui

For the URL values, you can use what you'd like. So if you're testing locally, you can use http://localhost:5555 for the account app if you have a local version running. Alternatively you're free to use the staging or production URLs.

For productions URLs you could ultimately not provide any value and the URL helpers will default to the production URLs. But for local dev and testing, it's usually easiest to keep the .env key value pairs so you don't forget about them.

.env for npm run dev local development

VITE_ACCOUNT=http://localhost:5555
VITE_CONNECT=https://connect.myunraid.net
VITE_UNRAID_NET=https://preview.unraid.net
VITE_OS_RELEASES="https://releases.unraid.net/os"
VITE_CALLBACK_KEY="FIND_IN_1PASSWORD"
VITE_ALLOW_CONSOLE_LOGS=true
VITE_TAILWIND_BASE_FONT_SIZE=16

.env.staging for npm run build:dev which tests builds in the Unraid webgui

Please take a look at the prebuild:dev & postbuild:dev scripts in package.json to see how the .env.staging file is used.

VITE_ACCOUNT=https://staging.account.unraid.net
VITE_CONNECT=https://connect.myunraid.net
VITE_UNRAID_NET=https://staging.unraid.net
VITE_OS_RELEASES="https://releases.unraid.net/os"
VITE_CALLBACK_KEY="FIND_IN_1PASSWORD"
VITE_ALLOW_CONSOLE_LOGS=TRUE

Notice how VITE_TAILWIND_BASE_FONT_SIZE is not set in the .env.staging file. This is because the Unraid webgui uses the font-size: 62.5% "trick".

.env.production for npm run build:webgui which does a production build for the Unraid webgui

Please take a look at the prebuild:webgui & postbuild:webgui scripts in package.json to see how the .env.production file is used.

VITE_ACCOUNT=https://account.unraid.net
VITE_CONNECT=https://connect.myunraid.net
VITE_UNRAID_NET=https://unraid.net
VITE_OS_RELEASES="https://releases.unraid.net/os"
VITE_CALLBACK_KEY="FIND_IN_1PASSWORD"

Both VITE_ALLOW_CONSOLE_LOGS and VITE_TAILWIND_BASE_FONT_SIZE should never be set here.

Interfacing with unraid-api

@todo Apollo VueJS Guide on Colocating Fragments