From facbda4f2f0a4986b7012c31055eaa15482b4f6a Mon Sep 17 00:00:00 2001
From: Niels van Velzen <git@ndat.nl>
Date: Sat, 23 Mar 2024 09:28:24 +0100
Subject: [PATCH] Add package.json name and version as defines to avoid
 importing the package.json in code

---
 .eslintrc.js                           | 4 +++-
 src/components/apphost.js              | 5 ++---
 src/controllers/dashboard/dashboard.js | 4 +---
 src/global.d.ts                        | 2 ++
 src/index.jsx                          | 3 +--
 webpack.common.js                      | 5 ++++-
 6 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 2b65ee767b..e44731edd1 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -265,7 +265,9 @@ module.exports = {
                 // Build time definitions
                 __JF_BUILD_VERSION__: 'readonly',
                 __USE_SYSTEM_FONTS__: 'readonly',
-                __WEBPACK_SERVE__: 'readonly'
+                __WEBPACK_SERVE__: 'readonly',
+                __PACKAGE_JSON_NAME__: 'readonly',
+                __PACKAGE_JSON_VERSION__: 'readonly'
             },
             rules: {
                 '@typescript-eslint/prefer-string-starts-ends-with': ['error']
diff --git a/src/components/apphost.js b/src/components/apphost.js
index 053b846374..8df5884bb1 100644
--- a/src/components/apphost.js
+++ b/src/components/apphost.js
@@ -1,4 +1,3 @@
-import Package from '../../package.json';
 import appSettings from '../scripts/settings/appSettings';
 import browser from '../scripts/browser';
 import Events from '../utils/events.ts';
@@ -36,7 +35,7 @@ function getDeviceProfile(item) {
         let profile;
 
         if (window.NativeShell) {
-            profile = window.NativeShell.AppHost.getDeviceProfile(profileBuilder, Package.version);
+            profile = window.NativeShell.AppHost.getDeviceProfile(profileBuilder, __PACKAGE_JSON_VERSION__);
         } else {
             const builderOpts = getBaseProfileOptions(item);
             profile = profileBuilder(builderOpts);
@@ -378,7 +377,7 @@ export const appHost = {
     },
     appVersion: function () {
         return window.NativeShell?.AppHost?.appVersion ?
-            window.NativeShell.AppHost.appVersion() : Package.version;
+            window.NativeShell.AppHost.appVersion() : __PACKAGE_JSON_VERSION__;
     },
     getPushTokenInfo: function () {
         return {};
diff --git a/src/controllers/dashboard/dashboard.js b/src/controllers/dashboard/dashboard.js
index 3ce4e85160..c85fdec6d6 100644
--- a/src/controllers/dashboard/dashboard.js
+++ b/src/controllers/dashboard/dashboard.js
@@ -26,8 +26,6 @@ import { getSystemInfoQuery } from 'hooks/useSystemInfo';
 import { toApi } from 'utils/jellyfin-apiclient/compat';
 import { queryClient } from 'utils/query/queryClient';
 
-import { version as WEB_VERSION } from '../../../package.json';
-
 import '../../elements/emby-button/emby-button';
 import '../../elements/emby-itemscontainer/emby-itemscontainer';
 
@@ -210,7 +208,7 @@ function refreshActiveRecordings(view, apiClient) {
 
 function reloadSystemInfo(view, apiClient) {
     view.querySelector('#buildVersion').innerText = __JF_BUILD_VERSION__;
-    view.querySelector('#webVersion').innerText = WEB_VERSION;
+    view.querySelector('#webVersion').innerText = __PACKAGE_JSON_VERSION__;
 
     queryClient
         .fetchQuery(getSystemInfoQuery(toApi(apiClient)))
diff --git a/src/global.d.ts b/src/global.d.ts
index 7d9fad7d73..12448ec249 100644
--- a/src/global.d.ts
+++ b/src/global.d.ts
@@ -18,4 +18,6 @@ export declare global {
     const __JF_BUILD_VERSION__: string;
     const __USE_SYSTEM_FONTS__: string;
     const __WEBPACK_SERVE__: string;
+    const __PACKAGE_JSON_NAME__: string;
+    const __PACKAGE_JSON_VERSION__: string;
 }
diff --git a/src/index.jsx b/src/index.jsx
index 4c9d965b98..3d65bae640 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -38,7 +38,6 @@ import './legacy/vendorStyles';
 import { currentSettings } from './scripts/settings/userSettings';
 import taskButton from './scripts/taskbutton';
 import RootApp from './RootApp.tsx';
-import { name as WEB_NAME, version as WEB_VERSION } from '../package.json';
 
 import './styles/livetv.scss';
 import './styles/dashboard.scss';
@@ -61,7 +60,7 @@ function loadCoreDictionary() {
 
 function init() {
     // Log current version to console to help out with issue triage and debugging
-    console.log(`${WEB_NAME} version ${WEB_VERSION} build ${__JF_BUILD_VERSION__}`);
+    console.log(`${__PACKAGE_JSON_NAME__} version ${__PACKAGE_JSON_VERSION__} build ${__JF_BUILD_VERSION__}`);
 
     // This is used in plugins
     window.Events = Events;
diff --git a/webpack.common.js b/webpack.common.js
index fef8db8a67..21e04775b3 100644
--- a/webpack.common.js
+++ b/webpack.common.js
@@ -5,6 +5,7 @@ const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const { DefinePlugin } = require('webpack');
+const packageJson = require('./package.json');
 
 const Assets = [
     'native-promise-only/npo.js',
@@ -52,7 +53,9 @@ const config = {
                     'Dev Server' :
                     process.env.JELLYFIN_VERSION || 'Release'),
             __USE_SYSTEM_FONTS__: JSON.stringify(!!process.env.USE_SYSTEM_FONTS),
-            __WEBPACK_SERVE__: JSON.stringify(!!process.env.WEBPACK_SERVE)
+            __WEBPACK_SERVE__: JSON.stringify(!!process.env.WEBPACK_SERVE),
+            __PACKAGE_JSON_NAME__: JSON.stringify(packageJson.name),
+            __PACKAGE_JSON_VERSION__: JSON.stringify(packageJson.version)
         }),
         new CleanWebpackPlugin(),
         new HtmlWebpackPlugin({