Update styling of folder select error state (#2150)

* Update styling of folder select error state
* Decrease icon margin
This commit is contained in:
InfiniteTF 2021-12-20 12:44:26 +01:00 committed by GitHub
parent 4927bb078c
commit cfcc6aff6a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -2,7 +2,7 @@ import React, { useEffect, useState, useMemo } from "react";
import { FormattedMessage } from "react-intl";
import { Button, InputGroup, Form } from "react-bootstrap";
import { debounce } from "lodash";
import { LoadingIndicator } from "src/components/Shared";
import { Icon, LoadingIndicator } from "src/components/Shared";
import { useDirectory } from "src/core/StashService";
interface IProps {
@ -69,7 +69,6 @@ export const FolderSelect: React.FC<IProps> = ({
return (
<>
{error ? <h1>{error.message}</h1> : ""}
<InputGroup>
<Form.Control
placeholder="File path"
@ -83,11 +82,18 @@ export const FolderSelect: React.FC<IProps> = ({
<InputGroup.Append>{appendButton}</InputGroup.Append>
) : undefined}
{!data || !data.directory || loading ? (
<InputGroup.Append>
<LoadingIndicator inline small message="" />
<InputGroup.Append className="align-self-center">
{loading ? (
<LoadingIndicator inline small message="" />
) : (
<Icon icon="times" color="red" className="ml-3" />
)}
</InputGroup.Append>
) : undefined}
</InputGroup>
{error !== undefined && (
<h5 className="mt-4 text-break">Error: {error.message}</h5>
)}
<ul className="folder-list">
{topDirectory}
{selectableDirectories.map((path) => {