diff --git a/ui/src/App.css b/ui/src/App.css index 74b5e05..cd7ada3 100644 --- a/ui/src/App.css +++ b/ui/src/App.css @@ -2,17 +2,6 @@ text-align: center; } -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - .App-header { background-color: #282c34; min-height: 100vh; diff --git a/ui/src/components/ImageComparison.tsx b/ui/src/components/ImageComparison.tsx index aa314da..b9378c5 100644 --- a/ui/src/components/ImageComparison.tsx +++ b/ui/src/components/ImageComparison.tsx @@ -4,7 +4,6 @@ import { Heading, Select, VStack, - Text } from '@chakra-ui/react'; import ImageById from "./ImageById"; import StylePromptTable from "./StylePromptTable"; diff --git a/ui/src/components/LargeImage.tsx b/ui/src/components/LargeImage.tsx index 012bbea..04d0784 100644 --- a/ui/src/components/LargeImage.tsx +++ b/ui/src/components/LargeImage.tsx @@ -4,11 +4,9 @@ import { ModalOverlay, ModalContent, ModalHeader, - ModalFooter, ModalBody, ModalCloseButton, Image, - Button } from '@chakra-ui/react'; interface Props { @@ -26,9 +24,6 @@ const LargeImage: React.FC = ({ onClose, prompt_id, style_id, - handleMouseLeave, - handleMouseEnter, - handleClick }) => { const imageUrl = `/image?prompt_id=${prompt_id}&style_id=${style_id}`; diff --git a/ui/src/components/StylePromptTable.tsx b/ui/src/components/StylePromptTable.tsx index a46f7e3..b7a4d1a 100644 --- a/ui/src/components/StylePromptTable.tsx +++ b/ui/src/components/StylePromptTable.tsx @@ -1,29 +1,29 @@ -import React, {useEffect, useState} from 'react'; +import React, {useState} from 'react'; import { Box, - Table, - Thead, - Tbody, - Tr, - Th, - Td, - useBreakpointValue, + Button, + Center, Modal, - ModalOverlay, - ModalContent, - ModalHeader, - ModalCloseButton, ModalBody, + ModalCloseButton, + ModalContent, ModalFooter, - Button, + ModalHeader, + ModalOverlay, + Spinner, + Table, + Tbody, + Td, Textarea, + Th, + Thead, + Tr, + useBreakpointValue, useDisclosure, - Spinner, - Center, } from '@chakra-ui/react'; import axios from 'axios'; import ImageById from './ImageById'; -import { Prompt, Style } from './SimpleTypes'; +import {Prompt, Style} from './SimpleTypes'; interface CheckpointPromptTableProps { prompts: Prompt[]; @@ -36,8 +36,8 @@ const StylePromptTable: React.FC = ({ styles, handleClick, }) => { - const boxSize = useBreakpointValue({ base: '90vw', md: 'auto' }); - const { isOpen, onOpen, onClose } = useDisclosure(); + const boxSize = useBreakpointValue({base: '90vw', md: 'auto'}); + const {isOpen, onOpen, onClose} = useDisclosure(); const [modalContent, setModalContent] = useState(null); const [loading, setLoading] = useState(false); @@ -104,14 +104,14 @@ const StylePromptTable: React.FC = ({ - + Style Details - + {loading ? (
- +
) : (