1.0.0-beta #1
1.0.0-beta #1
Conversation
| @@ -0,0 +1,362 @@ | |||
| { | |||
There was a problem hiding this comment.
| @@ -0,0 +1,4 @@ | |||
| { | |||
There was a problem hiding this comment.
As required by next-optimized-images@canary
https://github.com/cyrilwanner/next-optimized-images/tree/canary#installation
| @@ -0,0 +1,9 @@ | |||
| root = true | |||
There was a problem hiding this comment.
| "import/prefer-default-export": "off", | ||
| "jsx-a11y/click-events-have-key-events": "off", | ||
| "lines-between-class-members": "off", | ||
| "react-hooks/exhaustive-deps": "off", |
There was a problem hiding this comment.
Make this warn until all edge cases where it's needed can be tested.
| "global-require": "off", | ||
| "import/no-unresolved": "off", | ||
| "import/prefer-default-export": "off", | ||
| "jsx-a11y/click-events-have-key-events": "off", |
There was a problem hiding this comment.
Make this warn and eventually deal with these issues.
| @@ -0,0 +1,71 @@ | |||
| # For most projects, this workflow file will not need changing; you simply need | |||
There was a problem hiding this comment.
Added automatically via GitHub and formatted by Prettier.
| @@ -0,0 +1,19 @@ | |||
| { | |||
There was a problem hiding this comment.
| { | ||
| "extends": "stylelint-config-recommended", | ||
| "rules": { | ||
| "at-rule-no-unknown": [ |
There was a problem hiding this comment.
Could https://www.npmjs.com/package/stylelint-scss negate the need for this rule?
| @@ -0,0 +1,77 @@ | |||
| import styles from '@/styles/Programs/Dos.module.scss'; | |||
There was a problem hiding this comment.
Logic of import order (space between "types"):
- Files (png, svg, json, etc.)
- Styles
- Types modules then exports (alphabetical)
- Modules then exports (alphabetical)
NOTE: Perhaps add a style guide?
|
|
||
| import type { DosMainFn, DosRuntime } from 'js-dos'; | ||
| import type { DosCommandInterface } from 'js-dos/dist/typescript/js-dos-ci'; | ||
| import type { AppComponent } from '@/types/utils/programs'; |
There was a problem hiding this comment.
Alphabetize AppComponent
| import type { WindowWithDosModule } from '@/types/components/Programs/dos'; | ||
|
|
||
| import { useEffect, useRef } from 'react'; | ||
| import { getLockedAspectRatioDimensions } from '@/utils/dos'; |
There was a problem hiding this comment.
Alphabetize getLockedAspectRatioDimensions & focusClosestFocusableElementFromRef.
| import { TITLEBAR_HEIGHT } from '@/utils/constants'; | ||
| import { focusClosestFocusableElementFromRef } from '@/utils/elements'; | ||
|
|
||
| const dosOptions = { |
There was a problem hiding this comment.
Rename jsDosOptions to not confuse with DOS in general.
| onprogress: () => {} /* eslint @typescript-eslint/no-empty-function: off */ | ||
| }; | ||
|
|
||
| export const loaderOptions = { |
There was a problem hiding this comment.
Maybe an exported app should be an object of options and the component.
| bgColor: '#000000' | ||
| }; | ||
|
|
||
| const Dos: React.FC<AppComponent> = ({ |
There was a problem hiding this comment.
AppComponent needs to be rethought. Perhaps ProgramProps. Then make it an & of several clearly named types which represent the sources for Window/App passed params.
|
|
||
| const Dos: React.FC<AppComponent> = ({ | ||
| args = ['-c', 'CLS'], | ||
| file: { url, name = '' } = {}, |
There was a problem hiding this comment.
Remove the need for = {}, make file have a default as well as its key/values.
| }) => { | ||
| let ci: DosCommandInterface; | ||
| const canvasRef = useRef<HTMLCanvasElement>(null); | ||
| const loadMain = (main: DosMainFn, prependedArgs: string[] = []) => |
There was a problem hiding this comment.
Move loadMain and loadDos outside of the component to avoid recreation on re-renders.
| let ci: DosCommandInterface; | ||
| const canvasRef = useRef<HTMLCanvasElement>(null); | ||
| const loadMain = (main: DosMainFn, prependedArgs: string[] = []) => | ||
| main([...prependedArgs, ...args]).then((value) => { |
There was a problem hiding this comment.
Change value to dosCI.
| : {}; | ||
|
|
||
| useEffect(() => { | ||
| const { current: canvasElement } = canvasRef as { |
There was a problem hiding this comment.
Create a type for this canvasRef
| const { current: canvasElement } = canvasRef as { | ||
| current: HTMLCanvasElement; | ||
| }; | ||
| const { Dos: DosModule } = window as WindowWithDosModule; |
There was a problem hiding this comment.
Rename to JsDosModule and WindowWithJsDosModule
| } | ||
| }; | ||
| const maximizedStyle = maximized | ||
| ? getLockedAspectRatioDimensions(loaderOptions.width, loaderOptions.height) |
There was a problem hiding this comment.
getLockedAspectRatioDimensions, is this for maximum of window? Rename possibly.
| return ( | ||
| <div className={styles.dos} style={maximizedStyle}> | ||
| <canvas | ||
| onTouchStart={focusClosestFocusableElementFromRef(canvasRef)} |
There was a problem hiding this comment.
Element or something more specific like Window?
| return () => { | ||
| ci?.exit(); | ||
| }; | ||
| }, []); |
| DosModule(canvasElement, dosOptions).then(loadDos); | ||
|
|
||
| return () => { | ||
| ci?.exit(); |
There was a problem hiding this comment.
Can this be moved out of {}?
|
|
||
| import type { AppComponent } from '@/types/utils/programs'; | ||
|
|
||
| import { basename } from 'path'; |
There was a problem hiding this comment.
Reorganize basename to L8 and ProcessContext to L10
| import { ProcessContext } from '@/contexts/ProcessManager'; | ||
| import { ROOT_DIRECTORY } from '@/utils/constants'; | ||
|
|
||
| export const loaderOptions = { |
There was a problem hiding this comment.
If keeping loaderOptions then move to export area
No description provided.