feat(irc): improve list view (#466)

* feat(irc): add irc status examples

* feat(irc): add dropdown menu to list

* feat(irc): update heroicons and add expand button

* feat(irc): update heroicons and add expand button
This commit is contained in:
ze0s 2022-09-22 16:39:05 +02:00 committed by GitHub
parent f5faf066a9
commit 300418b9f1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
34 changed files with 478 additions and 258 deletions

View file

@ -1,10 +1,10 @@
import { Fragment } from "react";
import { useMutation } from "react-query";
import { toast } from "react-hot-toast";
import { XIcon } from "@heroicons/react/solid";
import { XMarkIcon } from "@heroicons/react/24/solid";
import { Dialog, Transition } from "@headlessui/react";
import { Field, Form, Formik, FormikErrors, FormikValues } from "formik";
import type { FieldProps } from "formik";
import { Field, Form, Formik, FormikErrors, FormikValues } from "formik";
import { queryClient } from "../../App";
import { APIClient } from "../../api/APIClient";
@ -87,7 +87,7 @@ function FilterAddForm({ isOpen, toggle }: filterAddFormProps) {
onClick={toggle}
>
<span className="sr-only">Close panel</span>
<XIcon className="h-6 w-6" aria-hidden="true" />
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
</div>

View file

@ -1,7 +1,7 @@
import { Fragment } from "react";
import { useMutation } from "react-query";
import { toast } from "react-hot-toast";
import { XIcon } from "@heroicons/react/solid";
import { XMarkIcon } from "@heroicons/react/24/solid";
import { Dialog, Transition } from "@headlessui/react";
import type { FieldProps } from "formik";
import { Field, Form, Formik, FormikErrors, FormikValues } from "formik";
@ -83,7 +83,7 @@ function APIKeyAddForm({ isOpen, toggle }: apiKeyAddFormProps) {
onClick={toggle}
>
<span className="sr-only">Close panel</span>
<XIcon className="h-6 w-6" aria-hidden="true"/>
<XMarkIcon className="h-6 w-6" aria-hidden="true"/>
</button>
</div>
</div>

View file

@ -1,7 +1,7 @@
import React, { Fragment, useRef, useState } from "react";
import { useMutation } from "react-query";
import { Dialog, Transition } from "@headlessui/react";
import { XIcon } from "@heroicons/react/solid";
import { XMarkIcon } from "@heroicons/react/24/solid";
import { classNames, sleep } from "../../utils";
import { Form, Formik, useFormikContext } from "formik";
import DEBUG from "../../components/debug";
@ -13,7 +13,13 @@ import { toast } from "react-hot-toast";
import Toast from "../../components/notifications/Toast";
import { useToggle } from "../../hooks/hooks";
import { DeleteModal } from "../../components/modals";
import { NumberFieldWide, PasswordFieldWide, SwitchGroupWide, TextFieldWide, RadioFieldsetWide } from "../../components/inputs";
import {
NumberFieldWide,
PasswordFieldWide,
RadioFieldsetWide,
SwitchGroupWide,
TextFieldWide
} from "../../components/inputs";
import DownloadClient from "../../screens/settings/DownloadClient";
interface InitialValuesSettings {
@ -511,7 +517,7 @@ export function DownloadClientAddForm({ isOpen, toggle }: formProps) {
onClick={toggle}
>
<span className="sr-only">Close panel</span>
<XIcon
<XMarkIcon
className="h-6 w-6"
aria-hidden="true"
/>
@ -710,7 +716,7 @@ export function DownloadClientUpdateForm({ client, isOpen, toggle }: updateFormP
onClick={toggle}
>
<span className="sr-only">Close panel</span>
<XIcon
<XMarkIcon
className="h-6 w-6"
aria-hidden="true"
/>

View file

@ -5,7 +5,7 @@ import Select, { components, ControlProps, InputProps, MenuProps, OptionProps }
import type { FieldProps } from "formik";
import { Field, Form, Formik, FormikValues } from "formik";
import { XIcon } from "@heroicons/react/solid";
import { XMarkIcon } from "@heroicons/react/24/solid";
import { Dialog, Transition } from "@headlessui/react";
import { sleep, slugify } from "../../utils";
@ -381,7 +381,7 @@ export function IndexerAddForm({ isOpen, toggle }: AddProps) {
onClick={toggle}
>
<span className="sr-only">Close panel</span>
<XIcon className="h-6 w-6" aria-hidden="true" />
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
</div>

View file

@ -1,20 +1,16 @@
import { useMutation } from "react-query";
import { toast } from "react-hot-toast";
import { XIcon } from "@heroicons/react/solid";
import { Field, FieldArray, FormikErrors, FormikValues } from "formik";
import type { FieldProps } from "formik";
import {useMutation} from "react-query";
import {toast} from "react-hot-toast";
import {XMarkIcon} from "@heroicons/react/24/solid";
import type {FieldProps} from "formik";
import {Field, FieldArray, FormikErrors, FormikValues} from "formik";
import { queryClient } from "../../App";
import { APIClient } from "../../api/APIClient";
import {queryClient} from "../../App";
import {APIClient} from "../../api/APIClient";
import {
TextFieldWide,
PasswordFieldWide,
SwitchGroupWide,
NumberFieldWide
} from "../../components/inputs";
import { SlideOver } from "../../components/panels";
import {NumberFieldWide, PasswordFieldWide, SwitchGroupWide, TextFieldWide} from "../../components/inputs";
import {SlideOver} from "../../components/panels";
import Toast from "../../components/notifications/Toast";
import {ExclamationTriangleIcon} from "@heroicons/react/24/outline";
interface ChannelsFieldArrayProps {
channels: IrcChannel[];
@ -62,7 +58,7 @@ const ChannelsFieldArray = ({ channels }: ChannelsFieldArrayProps) => (
onClick={() => remove(index)}
>
<span className="sr-only">Remove</span>
<XIcon className="h-6 w-6" aria-hidden="true" />
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
))
@ -160,6 +156,8 @@ export function IrcNetworkAddForm({ isOpen, toggle }: AddFormProps) {
>
{(values) => (
<div className="flex flex-col space-y-4 px-1 py-6 sm:py-0 sm:space-y-0">
<div className="flex justify-center dark:bg-red-300 text-sm font-bold text-center p-4 py-8 dark:text-red-800"><span className="flex"><ExclamationTriangleIcon className="mr-2 h-6 w-6" /> ADD NETWORKS VIA INDEXERS! ONLY USE THIS IS YOU DELETED NETWORKS</span></div>
<TextFieldWide
name="name"
label="Name"

View file

@ -1,19 +1,19 @@
import { Dialog, Transition } from "@headlessui/react";
import { Fragment } from "react";
import type { FieldProps } from "formik";
import { Field, Form, Formik, FormikErrors, FormikValues } from "formik";
import { XIcon } from "@heroicons/react/solid";
import Select, { components, ControlProps, InputProps, MenuProps, OptionProps } from "react-select";
import { PasswordFieldWide, SwitchGroupWide, TextFieldWide } from "../../components/inputs";
import {Dialog, Transition} from "@headlessui/react";
import {Fragment} from "react";
import type {FieldProps} from "formik";
import {Field, Form, Formik, FormikErrors, FormikValues} from "formik";
import {XMarkIcon} from "@heroicons/react/24/solid";
import Select, {components, ControlProps, InputProps, MenuProps, OptionProps} from "react-select";
import {PasswordFieldWide, SwitchGroupWide, TextFieldWide} from "../../components/inputs";
import DEBUG from "../../components/debug";
import { EventOptions, NotificationTypeOptions, SelectOption } from "../../domain/constants";
import { useMutation } from "react-query";
import { APIClient } from "../../api/APIClient";
import { queryClient } from "../../App";
import { toast } from "react-hot-toast";
import {EventOptions, NotificationTypeOptions, SelectOption} from "../../domain/constants";
import {useMutation} from "react-query";
import {APIClient} from "../../api/APIClient";
import {queryClient} from "../../App";
import {toast} from "react-hot-toast";
import Toast from "../../components/notifications/Toast";
import { SlideOver } from "../../components/panels";
import { componentMapType } from "./DownloadClientForms";
import {SlideOver} from "../../components/panels";
import {componentMapType} from "./DownloadClientForms";
const Input = (props: InputProps) => {
return (
@ -230,7 +230,7 @@ export function NotificationAddForm({ isOpen, toggle }: AddProps) {
onClick={toggle}
>
<span className="sr-only">Close panel</span>
<XIcon className="h-6 w-6" aria-hidden="true" />
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
</button>
</div>
</div>