mirror of
https://github.com/uqbar-dao/nectar.git
synced 2024-12-23 00:21:38 +03:00
Merge pull request #547 from kinode-dao/bp/launchbuttons
app_store UI fixes
This commit is contained in:
bitful-pannul
GitHub
commit
31f73db0b0
@ -83,6 +83,7 @@ form {
|
||||
.form-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
label {
|
||||
@ -94,6 +95,8 @@ select {
|
||||
padding: 0.5rem;
|
||||
border: 1px solid var(--gray);
|
||||
border-radius: var(--border-radius);
|
||||
background-color: light-dark(var(--white), var(--tasteful-dark));
|
||||
color: light-dark(var(--off-black), var(--off-white));
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
@ -201,6 +204,12 @@ td {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.app-title-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.app-id {
|
||||
font-size: 0.9rem;
|
||||
color: var(--gray);
|
||||
@ -228,277 +237,124 @@ td {
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* App Page */
|
||||
.app-page {
|
||||
background-color: light-dark(var(--off-white), var(--off-black));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.app-description {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.app-info {
|
||||
background-color: light-dark(var(--tan), var(--tasteful-dark));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.app-actions {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.app-screenshots {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.screenshot-container {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.app-screenshot {
|
||||
max-width: 200px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Store Page */
|
||||
.store-page {
|
||||
background-color: light-dark(var(--off-white), var(--off-black));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.store-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.app-list {
|
||||
background-color: light-dark(var(--tan), var(--tasteful-dark));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
/* Publish Page */
|
||||
.publish-page {
|
||||
background-color: light-dark(var(--off-white), var(--off-black));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.publish-form {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.my-packages {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.my-packages ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.my-packages li {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.5rem 0;
|
||||
border-bottom: 1px solid var(--gray);
|
||||
}
|
||||
|
||||
/* Download Page */
|
||||
/* App Page and Download Page shared styles */
|
||||
.app-page,
|
||||
.downloads-page {
|
||||
background-color: light-dark(var(--white), var(--maroon));
|
||||
border-radius: 8px;
|
||||
border-radius: var(--border-radius);
|
||||
padding: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.app-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.app-header h2 {
|
||||
margin: 0;
|
||||
.app-description {
|
||||
margin-bottom: 2rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.launch-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 14px;
|
||||
background-color: var(--orange);
|
||||
color: var(--white);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
.launch-button:hover {
|
||||
background-color: var(--dark-orange);
|
||||
}
|
||||
|
||||
.version-selector {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.version-selector select {
|
||||
width: 100%;
|
||||
padding: 0.75rem;
|
||||
border: 2px solid var(--orange);
|
||||
border-radius: 4px;
|
||||
background-color: light-dark(var(--white), var(--tasteful-dark));
|
||||
color: light-dark(var(--off-black), var(--off-white));
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.version-selector select:focus {
|
||||
outline: none;
|
||||
border-color: var(--dark-orange);
|
||||
box-shadow: 0 0 0 3px rgba(255, 79, 0, 0.2);
|
||||
.app-info {
|
||||
background-color: light-dark(var(--tan), var(--tasteful-dark));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1.5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
/* Download Page specific styles */
|
||||
.download-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
max-width: 20rem;
|
||||
}
|
||||
|
||||
.download-button,
|
||||
.install-button,
|
||||
.installed-button {
|
||||
.version-selector,
|
||||
.mirror-selector select {
|
||||
width: 100%;
|
||||
padding: 0.5em;
|
||||
border: 1px solid var(--gray);
|
||||
border-radius: var(--border-radius);
|
||||
background-color: light-dark(var(--white), var(--tasteful-dark));
|
||||
color: light-dark(var(--off-black), var(--off-white));
|
||||
}
|
||||
|
||||
/* Action Buttons */
|
||||
.action-button,
|
||||
.primary,
|
||||
.secondary {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
padding: 0.75em 1em;
|
||||
font-size: 1rem;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
border-radius: var(--border-radius);
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
transition: background-color 0.3s ease, color 0.3s ease;
|
||||
}
|
||||
|
||||
.download-button {
|
||||
.primary {
|
||||
background-color: var(--orange);
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.download-button:hover:not(:disabled) {
|
||||
.primary:hover:not(:disabled) {
|
||||
background-color: var(--dark-orange);
|
||||
}
|
||||
|
||||
.install-button {
|
||||
background-color: var(--blue);
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.install-button:hover {
|
||||
background-color: color-mix(in srgb, var(--blue) 80%, black);
|
||||
.secondary {
|
||||
background-color: light-dark(var(--off-white), var(--off-black));
|
||||
color: var(--orange);
|
||||
border: 2px solid var(--orange);
|
||||
}
|
||||
|
||||
.installed-button {
|
||||
background-color: var(--gray);
|
||||
.secondary:hover:not(:disabled) {
|
||||
background-color: var(--orange);
|
||||
color: var(--white);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.download-button:disabled,
|
||||
.install-button:disabled,
|
||||
.installed-button:disabled {
|
||||
.action-button:disabled,
|
||||
.primary:disabled,
|
||||
.secondary:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.my-downloads {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.my-downloads>button {
|
||||
/* App actions */
|
||||
.app-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background-color: transparent;
|
||||
color: var(--orange);
|
||||
border: 2px solid var(--orange);
|
||||
padding: 0.5rem 1rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease, color 0.3s ease;
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.my-downloads>button:hover {
|
||||
background-color: var(--orange);
|
||||
color: var(--white);
|
||||
/* Screenshots */
|
||||
.app-screenshots {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.my-downloads table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.my-downloads th,
|
||||
.my-downloads td {
|
||||
padding: 0.5rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--gray);
|
||||
}
|
||||
|
||||
.my-downloads td button {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.app-details {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.app-details>button {
|
||||
.screenshot-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background-color: transparent;
|
||||
color: var(--orange);
|
||||
border: 2px solid var(--orange);
|
||||
padding: 0.5rem 1rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease, color 0.3s ease;
|
||||
}
|
||||
|
||||
.app-details>button:hover {
|
||||
background-color: var(--orange);
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.app-details pre {
|
||||
background-color: light-dark(var(--tan), var(--tasteful-dark));
|
||||
color: light-dark(var(--off-black), var(--off-white));
|
||||
padding: 1rem;
|
||||
border-radius: 4px;
|
||||
gap: 1rem;
|
||||
overflow-x: auto;
|
||||
margin-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
.app-screenshot {
|
||||
max-width: 200px;
|
||||
height: auto;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
/* Capabilities approval popup */
|
||||
.cap-approval-popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@ -538,73 +394,23 @@ td {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
/* My Downloads Page */
|
||||
.my-downloads-page {
|
||||
background-color: light-dark(var(--off-white), var(--off-black));
|
||||
border-radius: var(--border-radius);
|
||||
padding: 1rem;
|
||||
}
|
||||
/* Responsive adjustments */
|
||||
@media (max-width: 48em) {
|
||||
|
||||
.app-page,
|
||||
.downloads-page {
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
/* Responsive Design */
|
||||
@media (max-width: 768px) {
|
||||
.app-actions {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.my-packages li {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.5rem;
|
||||
.download-section {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.cap-approval-popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.cap-approval-content {
|
||||
background-color: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
max-width: 80%;
|
||||
max-height: 80%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.download-progress {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 100px;
|
||||
height: 10px;
|
||||
background-color: #e0e0e0;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.progress-bar-fill {
|
||||
height: 100%;
|
||||
background-color: #4caf50;
|
||||
transition: width 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.progress-text {
|
||||
min-width: 50px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React, { useEffect, useState, useCallback } from "react";
|
||||
import React, { useEffect, useState, useCallback, useMemo } from "react";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import { FaDownload, FaCheck, FaTimes, FaPlay, FaSpinner, FaTrash, FaSync } from "react-icons/fa";
|
||||
import useAppsStore from "../store";
|
||||
@ -8,7 +8,7 @@ import { compareVersions } from "../utils/compareVersions";
|
||||
export default function AppPage() {
|
||||
const { id } = useParams();
|
||||
const navigate = useNavigate();
|
||||
const { fetchListing, fetchInstalledApp, uninstallApp, setAutoUpdate } = useAppsStore();
|
||||
const { fetchListing, fetchInstalledApp, uninstallApp, setAutoUpdate, getLaunchUrl, fetchHomepageApps } = useAppsStore();
|
||||
const [app, setApp] = useState<AppListing | null>(null);
|
||||
const [installedApp, setInstalledApp] = useState<PackageState | null>(null);
|
||||
const [currentVersion, setCurrentVersion] = useState<string | null>(null);
|
||||
@ -57,6 +57,21 @@ export default function AppPage() {
|
||||
}
|
||||
}, [id, fetchListing, fetchInstalledApp]);
|
||||
|
||||
|
||||
const handleLaunch = useCallback(() => {
|
||||
if (app) {
|
||||
const launchUrl = getLaunchUrl(`${app.package_id.package_name}:${app.package_id.publisher_node}`);
|
||||
if (launchUrl) {
|
||||
window.location.href = launchUrl;
|
||||
}
|
||||
}
|
||||
}, [app, getLaunchUrl]);
|
||||
|
||||
const canLaunch = useMemo(() => {
|
||||
if (!app) return false;
|
||||
return !!getLaunchUrl(`${app.package_id.package_name}:${app.package_id.publisher_node}`);
|
||||
}, [app, getLaunchUrl]);
|
||||
|
||||
const handleUninstall = async () => {
|
||||
if (!app) return;
|
||||
setIsUninstalling(true);
|
||||
@ -88,16 +103,13 @@ export default function AppPage() {
|
||||
|
||||
useEffect(() => {
|
||||
loadData();
|
||||
}, [loadData]);
|
||||
fetchHomepageApps();
|
||||
}, [loadData, fetchHomepageApps]);
|
||||
|
||||
const handleDownload = () => {
|
||||
navigate(`/download/${id}`);
|
||||
};
|
||||
|
||||
const handleLaunch = () => {
|
||||
window.location.href = `/${app?.package_id.package_name}:${app?.package_id.package_name}:${app?.package_id.publisher_node}/`;
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return <div className="app-page"><h4>Loading app details...</h4></div>;
|
||||
}
|
||||
@ -150,8 +162,12 @@ export default function AppPage() {
|
||||
<div className="app-actions">
|
||||
{installedApp && (
|
||||
<>
|
||||
<button onClick={handleLaunch} className="primary">
|
||||
<FaPlay /> Launch
|
||||
<button
|
||||
onClick={handleLaunch}
|
||||
className="primary"
|
||||
disabled={!canLaunch}
|
||||
>
|
||||
<FaPlay /> {canLaunch ? 'Launch' : 'No UI found for app'}
|
||||
</button>
|
||||
<button onClick={handleUninstall} className="secondary" disabled={isUninstalling}>
|
||||
{isUninstalling ? <FaSpinner className="fa-spin" /> : <FaTrash />} Uninstall
|
||||
|
||||
@ -17,6 +17,8 @@ export default function DownloadPage() {
|
||||
installApp,
|
||||
removeDownload,
|
||||
clearAllActiveDownloads,
|
||||
fetchHomepageApps,
|
||||
getLaunchUrl
|
||||
} = useAppsStore();
|
||||
|
||||
const [showMetadata, setShowMetadata] = useState(false);
|
||||
@ -35,8 +37,9 @@ export default function DownloadPage() {
|
||||
if (id) {
|
||||
fetchData(id);
|
||||
clearAllActiveDownloads();
|
||||
fetchHomepageApps();
|
||||
}
|
||||
}, [id, fetchData, clearAllActiveDownloads]);
|
||||
}, [id, fetchData, clearAllActiveDownloads, fetchHomepageApps]);
|
||||
|
||||
const handleMirrorSelect = useCallback((mirror: string, status: boolean | null | 'http') => {
|
||||
setSelectedMirror(mirror);
|
||||
@ -145,9 +148,17 @@ export default function DownloadPage() {
|
||||
|
||||
const handleLaunch = useCallback(() => {
|
||||
if (app) {
|
||||
navigate(`/${app.package_id.package_name}:${app.package_id.package_name}:${app.package_id.publisher_node}/`);
|
||||
const launchUrl = getLaunchUrl(`${app.package_id.package_name}:${app.package_id.publisher_node}`);
|
||||
if (launchUrl) {
|
||||
window.location.href = launchUrl;
|
||||
}
|
||||
}, [app, navigate]);
|
||||
}
|
||||
}, [app, getLaunchUrl]);
|
||||
|
||||
const canLaunch = useMemo(() => {
|
||||
if (!app) return false;
|
||||
return !!getLaunchUrl(`${app.package_id.package_name}:${app.package_id.publisher_node}`);
|
||||
}, [app, getLaunchUrl]);
|
||||
|
||||
if (!app) {
|
||||
return <div className="downloads-page"><h4>Loading app details...</h4></div>;
|
||||
@ -156,36 +167,48 @@ export default function DownloadPage() {
|
||||
return (
|
||||
<div className="downloads-page">
|
||||
<div className="app-header">
|
||||
<div className="app-title-container">
|
||||
{app.metadata?.image && (
|
||||
<img src={app.metadata.image} alt={app.metadata?.name || app.package_id.package_name} className="app-icon" />
|
||||
)}
|
||||
<div className="app-title">
|
||||
<h2>{app.metadata?.name || app.package_id.package_name}</h2>
|
||||
<p className="app-id">{`${app.package_id.package_name}.${app.package_id.publisher_node}`}</p>
|
||||
</div>
|
||||
</div>
|
||||
{installedApp && (
|
||||
<button onClick={handleLaunch} className="launch-button">
|
||||
<FaPlay /> Launch
|
||||
<button
|
||||
onClick={handleLaunch}
|
||||
className="launch-button"
|
||||
disabled={!canLaunch}
|
||||
>
|
||||
<FaPlay /> {canLaunch ? 'Launch' : 'No UI found for app'}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
<p>{app.metadata?.description}</p>
|
||||
<p className="app-description">{app.metadata?.description}</p>
|
||||
|
||||
<div className="version-selector">
|
||||
<div className="download-section">
|
||||
<select
|
||||
value={selectedVersion}
|
||||
onChange={(e) => setSelectedVersion(e.target.value)}
|
||||
className="version-selector"
|
||||
>
|
||||
{sortedVersions.map(({ version }, index) => (
|
||||
<option key={version} value={version}>
|
||||
{version} {index === 0 ? "(newest)" : ""}
|
||||
{installedApp && installedApp.our_version_hash === sortedVersions[index].hash ? " (installed)" : ""}
|
||||
<option value="">Select version</option>
|
||||
{sortedVersions.map((version) => (
|
||||
<option key={version.version} value={version.version}>
|
||||
{version.version}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="download-section">
|
||||
<MirrorSelector
|
||||
packageId={id}
|
||||
onMirrorSelect={handleMirrorSelect}
|
||||
/>
|
||||
|
||||
{isCurrentVersionInstalled ? (
|
||||
<button className="installed-button" disabled>
|
||||
<button className="action-button installed-button" disabled>
|
||||
<FaRocket /> Installed
|
||||
</button>
|
||||
) : isDownloaded ? (
|
||||
@ -196,7 +219,7 @@ export default function DownloadPage() {
|
||||
handleInstall(versionData.version, versionData.hash);
|
||||
}
|
||||
}}
|
||||
className="install-button"
|
||||
className="action-button install-button"
|
||||
>
|
||||
<FaRocket /> Install
|
||||
</button>
|
||||
@ -204,12 +227,11 @@ export default function DownloadPage() {
|
||||
<button
|
||||
onClick={handleDownload}
|
||||
disabled={!canDownload}
|
||||
className="download-button"
|
||||
className="action-button download-button"
|
||||
>
|
||||
{isDownloading ? (
|
||||
<>
|
||||
<FaSpinner className="fa-spin" />
|
||||
Downloading... {downloadProgress}%
|
||||
<FaSpinner className="fa-spin" /> Downloading... {downloadProgress}%
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { create } from 'zustand'
|
||||
import { persist } from 'zustand/middleware'
|
||||
import { PackageState, AppListing, MirrorCheckFile, PackageManifest, DownloadItem } from '../types/Apps'
|
||||
import { PackageState, AppListing, MirrorCheckFile, PackageManifest, DownloadItem, HomepageApp } from '../types/Apps'
|
||||
import { HTTP_STATUS } from '../constants/http'
|
||||
import KinodeClientApi from "@kinode/client-api"
|
||||
import { WEBSOCKET_URL } from '../utils/ws'
|
||||
@ -13,6 +13,7 @@ interface AppsStore {
|
||||
downloads: Record<string, DownloadItem[]>
|
||||
ourApps: AppListing[]
|
||||
ws: KinodeClientApi
|
||||
homepageApps: HomepageApp[]
|
||||
activeDownloads: Record<string, { downloaded: number, total: number }>
|
||||
|
||||
fetchData: (id: string) => Promise<void>
|
||||
@ -25,6 +26,9 @@ interface AppsStore {
|
||||
fetchDownloadsForApp: (id: string) => Promise<DownloadItem[]>
|
||||
checkMirror: (node: string) => Promise<MirrorCheckFile | null>
|
||||
|
||||
fetchHomepageApps: () => Promise<void>
|
||||
getLaunchUrl: (id: string) => string | null
|
||||
|
||||
installApp: (id: string, version_hash: string) => Promise<void>
|
||||
uninstallApp: (id: string) => Promise<void>
|
||||
downloadApp: (id: string, version_hash: string, downloadFrom: string) => Promise<void>
|
||||
@ -49,6 +53,8 @@ const useAppsStore = create<AppsStore>()(
|
||||
downloads: {},
|
||||
ourApps: [],
|
||||
activeDownloads: {},
|
||||
homepageApps: [],
|
||||
|
||||
|
||||
fetchData: async (id: string) => {
|
||||
if (!id) return;
|
||||
@ -174,6 +180,26 @@ const useAppsStore = create<AppsStore>()(
|
||||
return [];
|
||||
},
|
||||
|
||||
fetchHomepageApps: async () => {
|
||||
try {
|
||||
const res = await fetch('/apps');
|
||||
if (res.status === HTTP_STATUS.OK) {
|
||||
const data: HomepageApp[] = await res.json();
|
||||
set({ homepageApps: data });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching homepage apps:", error);
|
||||
}
|
||||
},
|
||||
|
||||
getLaunchUrl: (id: string) => {
|
||||
const app = get().homepageApps.find(app => `${app.package}:${app.publisher}` === id);
|
||||
if (app && app.path) {
|
||||
return app.path;
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
checkMirror: async (node: string) => {
|
||||
try {
|
||||
const res = await fetch(`${BASE_URL}/mirrorcheck/${node}`);
|
||||
|
||||
@ -70,3 +70,16 @@ export interface PackageManifest {
|
||||
grant_capabilities: any[]
|
||||
public: boolean
|
||||
}
|
||||
|
||||
export interface HomepageApp {
|
||||
id: string;
|
||||
process: string;
|
||||
package: string;
|
||||
publisher: string;
|
||||
path?: string;
|
||||
label: string;
|
||||
base64_icon?: string;
|
||||
widget?: string;
|
||||
order: number;
|
||||
favorite: boolean;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user