Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Auto-format frontend (#2009)

Browse Source 
* Auto-format frontend

* Update lint-frontend GA workflow node and checkout

* Fix linter error in ThemeChanger

* Add a `on: pull_request` to lint-frontend workflow

Co-authored-by: Lincoln Stein <lincoln.stein@gmail.com>
This commit is contained in:
Kaspar Emanuel 2022-12-16 12:56:39 +00:00 committed by GitHub
parent c0c4d7ca69
commit 2aa5bb6aad
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
21 changed files with 75 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.github/workflows/lint-frontend.yml vendored
View File

@ -1,6 +1,9 @@
name: Lint frontend name: Lint frontend
on: on:
pull_request:
paths:
- 'frontend/**'
push: push:
paths: paths:
- 'frontend/**' - 'frontend/**'
@ -14,11 +17,12 @@ jobs:
runs-on: ubuntu-22.04 runs-on: ubuntu-22.04
steps: steps:
- name: Setup Node 18 - name: Setup Node 18
uses: actions/setup-node@v2 uses: actions/setup-node@v3
with: with:
node-version: '18' node-version: '18'
- uses: actions/checkout@v2 - uses: actions/checkout@v3
- run: 'yarn install' - run: 'yarn install --frozen-lockfile'
- run: 'yarn tsc' - run: 'yarn tsc'
- run: 'yarn run madge' - run: 'yarn run madge'
- run: 'yarn run lint --max-warnings=0' - run: 'yarn run lint --max-warnings=0'
- run: 'yarn run prettier --check'

22
frontend/index.html
View File

@ -1,16 +1,14 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>InvokeAI - A Stable Diffusion Toolkit</title>
<link rel="shortcut icon" type="icon" href="favicon.ico" />
</head>
<head> <body>
<meta charset="UTF-8" /> <div id="root"></div>
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <script type="module" src="/src/main.tsx"></script>
<title>InvokeAI - A Stable Diffusion Toolkit</title> </body>
<link rel="shortcut icon" type="icon" href="favicon.ico" />
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html> </html>

3
frontend/package.json
View File

@ -10,6 +10,8 @@
"preview": "vite preview", "preview": "vite preview",
"madge": "madge --circular src/main.tsx", "madge": "madge --circular src/main.tsx",
"lint": "eslint src/", "lint": "eslint src/",
"prettier": "prettier '*.{json,cjs,ts,html}' 'src/**/*.{ts,tsx}'",
"fmt": "npm run prettier -- --write",
"postinstall": "patch-package" "postinstall": "patch-package"
}, },
"dependencies": { "dependencies": {
@ -63,6 +65,7 @@
"madge": "^5.0.1", "madge": "^5.0.1",
"patch-package": "^6.5.0", "patch-package": "^6.5.0",
"postinstall-postinstall": "^2.1.0", "postinstall-postinstall": "^2.1.0",
"prettier": "^2.8.1",
"sass": "^1.55.0", "sass": "^1.55.0",
"terser": "^5.16.1", "terser": "^5.16.1",
"tsc-watch": "^5.0.3", "tsc-watch": "^5.0.3",

32
frontend/src/Loading.tsx
View File

@ -1,22 +1,22 @@
import { Flex, Spinner } from '@chakra-ui/react'; import { Flex, Spinner } from '@chakra-ui/react';
const Loading = () => { const Loading = () => {
return ( return (
<Flex <Flex
width={'100vw'} width={'100vw'}
height={'100vh'} height={'100vh'}
alignItems='center' alignItems="center"
justifyContent='center' justifyContent="center"
> >
<Spinner <Spinner
thickness='2px' thickness="2px"
speed='1s' speed="1s"
emptyColor='gray.200' emptyColor="gray.200"
color='gray.400' color="gray.400"
size='xl' size="xl"
/> />
</Flex> </Flex>
); );
}; };
export default Loading; export default Loading;

9
frontend/src/common/components/radix-ui/IAITooltip.tsx
View File

@ -20,10 +20,15 @@ const IAITooltip = (props: IAITooltipProps) => {
<Tooltip.Portal> <Tooltip.Portal>
<Tooltip.Content <Tooltip.Content
{...contentProps} {...contentProps}
onPointerDownOutside={(e) => {e.preventDefault()}} onPointerDownOutside={(e) => {
e.preventDefault();
}}
className="invokeai__tooltip-content" className="invokeai__tooltip-content"
> >
<Tooltip.Arrow {...arrowProps} className="invokeai__tooltip-arrow" /> <Tooltip.Arrow
{...arrowProps}
className="invokeai__tooltip-arrow"
/>
{children} {children}
</Tooltip.Content> </Tooltip.Content>
</Tooltip.Portal> </Tooltip.Portal>

2
frontend/src/common/hooks/useClickOutsideWatcher.ts
View File

@ -1,4 +1,4 @@
import { RefObject, useEffect} from 'react'; import { RefObject, useEffect } from 'react';
const watchers: { const watchers: {
ref: RefObject<HTMLElement>; ref: RefObject<HTMLElement>;

2
frontend/src/common/icons/ImageToImageIcon.tsx
View File

@ -1,4 +1,4 @@
import { createIcon } from "@chakra-ui/react"; import { createIcon } from '@chakra-ui/react';
const ImageToImageIcon = createIcon({ const ImageToImageIcon = createIcon({
displayName: 'ImageToImageIcon', displayName: 'ImageToImageIcon',

2
frontend/src/common/icons/NodesIcon.tsx
View File

@ -1,4 +1,4 @@
import { createIcon } from "@chakra-ui/react"; import { createIcon } from '@chakra-ui/react';
const NodesIcon = createIcon({ const NodesIcon = createIcon({
displayName: 'NodesIcon', displayName: 'NodesIcon',

2
frontend/src/common/icons/OutpaintIcon.tsx
View File

@ -1,4 +1,4 @@
import { createIcon } from "@chakra-ui/react"; import { createIcon } from '@chakra-ui/react';
const OutpaintIcon = createIcon({ const OutpaintIcon = createIcon({
displayName: 'OutpaintIcon', displayName: 'OutpaintIcon',

2
frontend/src/common/icons/TextToImageIcon.tsx
View File

@ -1,4 +1,4 @@
import { createIcon } from "@chakra-ui/react"; import { createIcon } from '@chakra-ui/react';
const TextToImageIcon = createIcon({ const TextToImageIcon = createIcon({
displayName: 'TextToImageIcon', displayName: 'TextToImageIcon',

5
frontend/src/features/canvas/hooks/useCanvasMouseUp.ts
View File

@ -4,7 +4,10 @@ import { activeTabNameSelector } from 'features/options/store/optionsSelectors';
import Konva from 'konva'; import Konva from 'konva';
import _ from 'lodash'; import _ from 'lodash';
import { MutableRefObject, useCallback } from 'react'; import { MutableRefObject, useCallback } from 'react';
import { canvasSelector, isStagingSelector } from 'features/canvas/store/canvasSelectors'; import {
canvasSelector,
isStagingSelector,
} from 'features/canvas/store/canvasSelectors';
import { import {
// addPointToCurrentEraserLine, // addPointToCurrentEraserLine,
addPointToCurrentLine, addPointToCurrentLine,

2
frontend/src/features/gallery/store/thunks/uploadImage.ts
View File

@ -38,7 +38,7 @@ export const uploadImage =
}); });
const image = (await response.json()) as InvokeAI.ImageUploadResponse; const image = (await response.json()) as InvokeAI.ImageUploadResponse;
console.log(image) console.log(image);
const newImage: InvokeAI.Image = { const newImage: InvokeAI.Image = {
uuid: uuidv4(), uuid: uuidv4(),
category: 'user', category: 'user',

3
frontend/src/features/options/components/AdvancedOptions/Canvas/BoundingBoxSettings/BoundingBoxSettings.tsx
View File

@ -9,7 +9,8 @@ import _ from 'lodash';
const selector = createSelector( const selector = createSelector(
canvasSelector, canvasSelector,
(canvas) => { (canvas) => {
const { boundingBoxDimensions, boundingBoxScaleMethod: boundingBoxScale } = canvas; const { boundingBoxDimensions, boundingBoxScaleMethod: boundingBoxScale } =
canvas;
return { return {
boundingBoxDimensions, boundingBoxDimensions,
boundingBoxScale, boundingBoxScale,

2
frontend/src/features/options/components/AdvancedOptions/Upscale/UpscaleOptions.tsx
View File

@ -60,7 +60,7 @@ const UpscaleOptions = () => {
const handleChangeStrength = (v: number) => dispatch(setUpscalingStrength(v)); const handleChangeStrength = (v: number) => dispatch(setUpscalingStrength(v));
return ( return (
<div className='upscale-options'> <div className="upscale-options">
<IAISelect <IAISelect
isDisabled={!isESRGANAvailable} isDisabled={!isESRGANAvailable}
label="Scale" label="Scale"

5
frontend/src/features/options/components/ProcessButtons/Loopback.tsx
View File

@ -3,7 +3,10 @@ import { FaRecycle } from 'react-icons/fa';
import { RootState } from 'app/store'; import { RootState } from 'app/store';
import { useAppDispatch, useAppSelector } from 'app/storeHooks'; import { useAppDispatch, useAppSelector } from 'app/storeHooks';
import IAIIconButton from 'common/components/IAIIconButton'; import IAIIconButton from 'common/components/IAIIconButton';
import { OptionsState, setShouldLoopback } from 'features/options/store/optionsSlice'; import {
OptionsState,
setShouldLoopback,
} from 'features/options/store/optionsSlice';
const loopbackSelector = createSelector( const loopbackSelector = createSelector(
(state: RootState) => state.options, (state: RootState) => state.options,

6
frontend/src/features/system/components/Console.tsx
View File

@ -1,7 +1,11 @@
import { IconButton, Tooltip } from '@chakra-ui/react'; import { IconButton, Tooltip } from '@chakra-ui/react';
import { useAppDispatch, useAppSelector } from 'app/storeHooks'; import { useAppDispatch, useAppSelector } from 'app/storeHooks';
import { RootState } from 'app/store'; import { RootState } from 'app/store';
import { errorSeen, setShouldShowLogViewer, SystemState } from 'features/system/store/systemSlice'; import {
errorSeen,
setShouldShowLogViewer,
SystemState,
} from 'features/system/store/systemSlice';
import { useLayoutEffect, useRef, useState } from 'react'; import { useLayoutEffect, useRef, useState } from 'react';
import { FaAngleDoubleDown, FaCode, FaMinus } from 'react-icons/fa'; import { FaAngleDoubleDown, FaCode, FaMinus } from 'react-icons/fa';
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';

2
frontend/src/features/system/components/ThemeChanger.tsx
View File

@ -23,7 +23,7 @@ export default function ThemeChanger() {
if (colorMode !== currentTheme) { if (colorMode !== currentTheme) {
setColorMode(currentTheme); setColorMode(currentTheme);
} }
}, [colorMode, currentTheme]); }, [setColorMode, colorMode, currentTheme]);
const handleChangeTheme = (theme: string) => { const handleChangeTheme = (theme: string) => {
dispatch(setCurrentTheme(theme)); dispatch(setCurrentTheme(theme));

2
frontend/src/features/tabs/components/ImageToImage/InitImagePreview.tsx
View File

@ -31,7 +31,7 @@ export default function InitImagePreview() {
return ( return (
<> <>
<div className="init-image-preview-header"> <div className="init-image-preview-header">
{/* <div className="init-image-preview-header"> */} {/* <div className="init-image-preview-header"> */}
<h2>Initial Image</h2> <h2>Initial Image</h2>
{/* <IconButton {/* <IconButton
isDisabled={!initialImage} isDisabled={!initialImage}

5
frontend/yarn.lock
View File

@ -3880,6 +3880,11 @@ prettier-linter-helpers@^1.0.0:
dependencies: dependencies:
fast-diff "^1.1.2" fast-diff "^1.1.2"
prettier@^2.8.1:
version "2.8.1"
resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.1.tgz#4e1fd11c34e2421bc1da9aea9bd8127cd0a35efc"
integrity sha512-lqGoSJBQNJidqCHE80vqZJHWHRFoNYsSpP9AjFhlhi9ODCJA541svILes/+/1GM3VaL/abZi7cpFzOpdR9UPKg==
pretty-ms@^7.0.1: pretty-ms@^7.0.1:
version "7.0.1" version "7.0.1"
resolved "https://registry.yarnpkg.com/pretty-ms/-/pretty-ms-7.0.1.tgz#7d903eaab281f7d8e03c66f867e239dc32fb73e8" resolved "https://registry.yarnpkg.com/pretty-ms/-/pretty-ms-7.0.1.tgz#7d903eaab281f7d8e03c66f867e239dc32fb73e8"