Migrate paths dashboard widget to react and add storage metrics

This commit is contained in:
Bill Thornton
2025-06-03 16:28:22 -04:00
parent a938650ded
commit 09063d3376
11 changed files with 322 additions and 81 deletions
+1 -38
View File
@@ -75,44 +75,7 @@
</div>
</div>
<div class="dashboardSection">
<a is="emby-linkbutton" href="#/dashboard/settings" class="button-flat sectionTitleTextButton">
<h3>${HeaderPaths}</h3>
<span class="material-icons chevron_right" aria-hidden="true"></span>
</a>
<div class="paperList">
<div class="listItem listItem-border">
<div class="listItemBody two-line">
<div class="listItemBodyText secondary" style="margin:0;">${LabelCache}</div>
<div class="listItemBodyText" id="cachePath" dir="ltr" style="text-align: left;"></div>
</div>
</div>
<div class="listItem listItem-border">
<div class="listItemBody two-line">
<div class="listItemBodyText secondary" style="margin:0;">${LabelLogs}</div>
<div class="listItemBodyText" id="logPath" dir="ltr" style="text-align: left;"></div>
</div>
</div>
<div class="listItem listItem-border">
<div class="listItemBody two-line">
<div class="listItemBodyText secondary" style="margin:0;">${LabelMetadata}</div>
<div class="listItemBodyText" id="metadataPath" dir="ltr" style="text-align: left;"></div>
</div>
</div>
<div class="listItem listItem-border">
<div class="listItemBody two-line">
<div class="listItemBodyText secondary" style="margin:0;">${LabelTranscodes}</div>
<div class="listItemBodyText" id="transcodePath" dir="ltr" style="text-align: left;"></div>
</div>
</div>
<div class="listItem listItem-border">
<div class="listItemBody two-line">
<div class="listItemBodyText secondary" style="margin:0;">${LabelWeb}</div>
<div class="listItemBodyText" id="webPath" dir="ltr" style="text-align: left;"></div>
</div>
</div>
</div>
</div>
<div id="serverPaths" class="dashboardSection"></div>
</div>
</div>
+21 -24
View File
@@ -1,30 +1,31 @@
import escapeHtml from 'escape-html';
import datetime from 'scripts/datetime';
import Events from 'utils/events.ts';
import ServerPathWidget from 'apps/dashboard/components/widgets/ServerPathWidget';
import ActivityLog from 'components/activitylog';
import alert from 'components/alert';
import cardBuilder from 'components/cardbuilder/cardBuilder';
import { getDefaultBackgroundClass } from 'components/cardbuilder/cardBuilderUtils';
import confirm from 'components/confirm/confirm';
import imageLoader from 'components/images/imageLoader';
import indicators from 'components/indicators/indicators';
import itemHelper from 'components/itemHelper';
import serverNotifications from 'scripts/serverNotifications';
import dom from 'scripts/dom';
import globalize from 'lib/globalize';
import { formatDistanceToNow } from 'date-fns';
import { getLocaleWithSuffix } from 'utils/dateFnsLocale.ts';
import loading from 'components/loading/loading';
import playMethodHelper from 'components/playback/playmethodhelper';
import cardBuilder from 'components/cardbuilder/cardBuilder';
import imageLoader from 'components/images/imageLoader';
import ActivityLog from 'components/activitylog';
import imageHelper from 'utils/image';
import indicators from 'components/indicators/indicators';
import { formatDistanceToNow } from 'date-fns';
import { getSystemInfoQuery } from 'hooks/useSystemInfo';
import globalize from 'lib/globalize';
import { ServerConnections } from 'lib/jellyfin-apiclient';
import datetime from 'scripts/datetime';
import dom from 'scripts/dom';
import serverNotifications from 'scripts/serverNotifications';
import taskButton from 'scripts/taskbutton';
import Dashboard from 'utils/dashboard';
import alert from 'components/alert';
import confirm from 'components/confirm/confirm';
import { getDefaultBackgroundClass } from 'components/cardbuilder/cardBuilderUtils';
import { getSystemInfoQuery } from 'hooks/useSystemInfo';
import { ServerConnections } from 'lib/jellyfin-apiclient';
import { getLocaleWithSuffix } from 'utils/dateFnsLocale.ts';
import Events from 'utils/events.ts';
import imageHelper from 'utils/image';
import { toApi } from 'utils/jellyfin-apiclient/compat';
import { queryClient } from 'utils/query/queryClient';
import { renderComponent } from 'utils/reactUtils';
import 'elements/emby-button/emby-button';
import 'elements/emby-itemscontainer/emby-itemscontainer';
@@ -220,12 +221,6 @@ function reloadSystemInfo(view, apiClient) {
.then(systemInfo => {
view.querySelector('#serverName').innerText = systemInfo.ServerName;
view.querySelector('#versionNumber').innerText = systemInfo.Version;
view.querySelector('#cachePath').innerText = systemInfo.CachePath;
view.querySelector('#logPath').innerText = systemInfo.LogPath;
view.querySelector('#transcodePath').innerText = systemInfo.TranscodingTempPath;
view.querySelector('#metadataPath').innerText = systemInfo.InternalMetadataPath;
view.querySelector('#webPath').innerText = systemInfo.WebPath;
});
}
@@ -827,6 +822,8 @@ export default function (view) {
button: page.querySelector('.btnRefresh')
});
renderComponent(ServerPathWidget, {}, page.querySelector('#serverPaths'));
page.querySelector('#btnRestartServer').addEventListener('click', DashboardPage.restart);
page.querySelector('#btnShutdown').addEventListener('click', DashboardPage.shutdown);
});