Updater UI tweaks, Markdown tweaks, bump lib

This commit is contained in:
AAGaming
2022-09-18 14:53:36 -04:00
parent c774451ff4
commit 0f06bc1ef0
4 changed files with 51 additions and 41 deletions
+1 -1
View File
@@ -41,7 +41,7 @@
} }
}, },
"dependencies": { "dependencies": {
"decky-frontend-lib": "^3.0.0", "decky-frontend-lib": "^3.1.0",
"react-file-icon": "^1.2.0", "react-file-icon": "^1.2.0",
"react-icons": "^4.4.0", "react-icons": "^4.4.0",
"react-markdown": "^8.0.3", "react-markdown": "^8.0.3",
+4 -4
View File
@@ -10,7 +10,7 @@ specifiers:
'@types/react-file-icon': ^1.0.1 '@types/react-file-icon': ^1.0.1
'@types/react-router': 5.1.18 '@types/react-router': 5.1.18
'@types/webpack': ^5.28.0 '@types/webpack': ^5.28.0
decky-frontend-lib: ^3.0.0 decky-frontend-lib: ^3.1.0
husky: ^8.0.1 husky: ^8.0.1
import-sort-style-module: ^6.0.0 import-sort-style-module: ^6.0.0
inquirer: ^8.2.4 inquirer: ^8.2.4
@@ -30,7 +30,7 @@ specifiers:
typescript: ^4.7.4 typescript: ^4.7.4
dependencies: dependencies:
decky-frontend-lib: 3.0.0 decky-frontend-lib: 3.1.0
react-file-icon: 1.2.0_wcqkhtmu7mswc6yz4uyexck3ty react-file-icon: 1.2.0_wcqkhtmu7mswc6yz4uyexck3ty
react-icons: 4.4.0_react@16.14.0 react-icons: 4.4.0_react@16.14.0
react-markdown: 8.0.3_vshvapmxg47tngu7tvrsqpq55u react-markdown: 8.0.3_vshvapmxg47tngu7tvrsqpq55u
@@ -944,8 +944,8 @@ packages:
dependencies: dependencies:
ms: 2.1.2 ms: 2.1.2
/decky-frontend-lib/3.0.0: /decky-frontend-lib/3.1.0:
resolution: {integrity: sha512-ZqJ9ii7QoYWHFfkU8hV82IHi3+McZDmE4wS22duXpgRI8r5BBMiZItw6tYkc24ZtsJIVso83FFt7adcEBqBwJA==} resolution: {integrity: sha512-qawFq2p0I69sN9pu2GkoL1pTrkunWzYOMl6SwEPGA8lPL0AxqKzb44BXzH5s6hxBwAcda7/FiNaUWmGyhgpPHA==}
dependencies: dependencies:
minimist: 1.2.6 minimist: 1.2.6
dev: false dev: false
-1
View File
@@ -15,7 +15,6 @@ const Markdown: FunctionComponent<MarkdownProps> = (props) => {
components={{ components={{
div: (nodeProps) => <Focusable {...nodeProps.node.properties}>{nodeProps.children}</Focusable>, div: (nodeProps) => <Focusable {...nodeProps.node.properties}>{nodeProps.children}</Focusable>,
a: (nodeProps) => { a: (nodeProps) => {
console.log(nodeProps.node, nodeProps);
const aRef = useRef<HTMLAnchorElement>(null); const aRef = useRef<HTMLAnchorElement>(null);
return ( return (
// TODO fix focus ring // TODO fix focus ring
@@ -1,4 +1,13 @@
import { Carousel, DialogButton, Field, Focusable, ProgressBarWithInfo, Spinner, showModal } from 'decky-frontend-lib'; import {
Carousel,
DialogButton,
Field,
FocusRing,
Focusable,
ProgressBarWithInfo,
Spinner,
showModal,
} from 'decky-frontend-lib';
import { useCallback } from 'react'; import { useCallback } from 'react';
import { Suspense, lazy } from 'react'; import { Suspense, lazy } from 'react';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
@@ -14,39 +23,41 @@ const MarkdownRenderer = lazy(() => import('../../../Markdown'));
function PatchNotesModal({ versionInfo, closeModal }: { versionInfo: VerInfo | null; closeModal?: () => {} }) { function PatchNotesModal({ versionInfo, closeModal }: { versionInfo: VerInfo | null; closeModal?: () => {} }) {
return ( return (
<Focusable onCancelButton={closeModal}> <Focusable onCancelButton={closeModal}>
<Carousel <FocusRing>
fnItemRenderer={(id: number) => ( <Carousel
<Focusable fnItemRenderer={(id: number) => (
style={{ <Focusable
marginTop: '40px', style={{
height: 'calc( 100% - 40px )', marginTop: '40px',
overflowY: 'scroll', height: 'calc( 100% - 40px )',
display: 'flex', overflowY: 'scroll',
justifyContent: 'center', display: 'flex',
margin: '40px', justifyContent: 'center',
}} margin: '40px',
> }}
<div> >
<h1>{versionInfo?.all?.[id]?.name}</h1> <div>
{versionInfo?.all?.[id]?.body ? ( <h1>{versionInfo?.all?.[id]?.name}</h1>
<WithSuspense> {versionInfo?.all?.[id]?.body ? (
<MarkdownRenderer onDismiss={closeModal}>{versionInfo.all[id].body}</MarkdownRenderer> <WithSuspense>
</WithSuspense> <MarkdownRenderer onDismiss={closeModal}>{versionInfo.all[id].body}</MarkdownRenderer>
) : ( </WithSuspense>
'no patch notes for this version' ) : (
)} 'no patch notes for this version'
</div> )}
</Focusable> </div>
)} </Focusable>
fnGetId={(id) => id} )}
nNumItems={versionInfo?.all?.length} fnGetId={(id) => id}
nHeight={window.innerHeight - 40} nNumItems={versionInfo?.all?.length}
nItemHeight={window.innerHeight - 40} nHeight={window.innerHeight - 40}
nItemMarginX={0} nItemHeight={window.innerHeight - 40}
initialColumn={0} nItemMarginX={0}
autoFocus={true} initialColumn={0}
fnGetColumnWidth={() => window.innerWidth} autoFocus={true}
/> fnGetColumnWidth={() => window.innerWidth}
/>
</FocusRing>
</Focusable> </Focusable>
); );
} }
@@ -123,7 +134,7 @@ export default function UpdaterSettings() {
) : ( ) : (
<ProgressBarWithInfo <ProgressBarWithInfo
layout="inline" layout="inline"
bottomSeparator={false} bottomSeparator="none"
nProgress={updateProgress} nProgress={updateProgress}
indeterminate={reloading} indeterminate={reloading}
sOperationText={reloading ? 'Reloading' : 'Updating'} sOperationText={reloading ? 'Reloading' : 'Updating'}