AppFlowy/frontend/appflowy_tauri/src/appflowy_app/components/tests/AllIcons.tsx

import AddSvg from '$app/components/_shared/svg/AddSvg';
import { ArrowLeftSvg } from '$app/components/_shared/svg/ArrowLeftSvg';
import { ArrowRightSvg } from '$app/components/_shared/svg/ArrowRightSvg';
import { BoardSvg } from '$app/components/_shared/svg/BoardSvg';
import { CheckboxSvg } from '$app/components/_shared/svg/CheckboxSvg';
import { ChecklistTypeSvg } from '$app/components/_shared/svg/ChecklistTypeSvg';
import { CheckmarkSvg } from '$app/components/_shared/svg/CheckmarkSvg';
import { ClockSvg } from '$app/components/_shared/svg/ClockSvg';
import { CloseSvg } from '$app/components/_shared/svg/CloseSvg';
import { CopySvg } from '$app/components/_shared/svg/CopySvg';
import { DateTypeSvg } from '$app/components/_shared/svg/DateTypeSvg';
import { Details2Svg } from '$app/components/_shared/svg/Details2Svg';
import { DocumentSvg } from '$app/components/_shared/svg/DocumentSvg';
import { DropDownShowSvg } from '$app/components/_shared/svg/DropDownShowSvg';
import { EarthSvg } from '$app/components/_shared/svg/EarthSvg';
import { EditorCheckSvg } from '$app/components/_shared/svg/EditorCheckSvg';
import { EditorUncheckSvg } from '$app/components/_shared/svg/EditorUncheckSvg';
import { EditSvg } from '$app/components/_shared/svg/EditSvg';
import { EyeClosedSvg } from '$app/components/_shared/svg/EyeClosedSvg';
import { EyeOpenSvg } from '$app/components/_shared/svg/EyeOpenSvg';
import { FilterSvg } from '$app/components/_shared/svg/FilterSvg';
import { GridSvg } from '$app/components/_shared/svg/GridSvg';
import { GroupByFieldSvg } from '$app/components/_shared/svg/GroupByFieldSvg';
import { HideMenuSvg } from '$app/components/_shared/svg/HideMenuSvg';
import { InformationSvg } from '$app/components/_shared/svg/InformationSvg';
import { LogoutSvg } from '$app/components/_shared/svg/LogoutSvg';
import { MoreSvg } from '$app/components/_shared/svg/MoreSvg';
import { MultiSelectTypeSvg } from '$app/components/_shared/svg/MultiSelectTypeSvg';
import { NumberTypeSvg } from '$app/components/_shared/svg/NumberTypeSvg';
import { PropertiesSvg } from '$app/components/_shared/svg/PropertiesSvg';
import { SearchSvg } from '$app/components/_shared/svg/SearchSvg';
import { ShowMenuSvg } from '$app/components/_shared/svg/ShowMenuSvg';
import { SingleSelectTypeSvg } from '$app/components/_shared/svg/SingleSelectTypeSvg';
import { SkipLeftSvg } from '$app/components/_shared/svg/SkipLeftSvg';
import { SkipRightSvg } from '$app/components/_shared/svg/SkipRightSvg';
import { SortSvg } from '$app/components/_shared/svg/SortSvg';
import { TextTypeSvg } from '$app/components/_shared/svg/TextTypeSvg';
import { TrashSvg } from '$app/components/_shared/svg/TrashSvg';
import { UrlTypeSvg } from '$app/components/_shared/svg/UrlTypeSvg';
import { DragElementSvg } from '$app/components/_shared/svg/DragElementSvg';
import { ImageSvg } from '$app/components/_shared/svg/ImageSvg';

export const AllIcons = () => {
  return (
    <div className={'p-8'}>
      <h1 className={'mb-12 text-2xl'}>Icons</h1>
      <div className={'mb-8'}>
        <div className={'flex flex-wrap items-center gap-8'}>
          <i className={'h-5 w-5'} title={'AddSvg'}>
            <AddSvg></AddSvg>
          </i>
          <i className={'h-5 w-5'} title={'ArrowLeftSvg'}>
            <ArrowLeftSvg></ArrowLeftSvg>
          </i>
          <i className={'h-5 w-5'} title={'ArrowRightSvg'}>
            <ArrowRightSvg></ArrowRightSvg>
          </i>
          <i className={'h-5 w-5'} title={'BoardSvg'}>
            <BoardSvg></BoardSvg>
          </i>
          <i className={'h-5 w-5'} title={'CheckboxSvg'}>
            <CheckboxSvg></CheckboxSvg>
          </i>
          <i className={'h-5 w-5'} title={'ChecklistTypeSvg'}>
            <ChecklistTypeSvg></ChecklistTypeSvg>
          </i>
          <i className={'h-5 w-5'} title={'CheckmarkSvg'}>
            <CheckmarkSvg></CheckmarkSvg>
          </i>
          <i className={'h-5 w-5'} title={'ClockSvg'}>
            <ClockSvg></ClockSvg>
          </i>
          <i className={'h-5 w-5'} title={'CloseSvg'}>
            <CloseSvg></CloseSvg>
          </i>
          <i className={'h-5 w-5'} title={'CopySvg'}>
            <CopySvg></CopySvg>
          </i>
          <i className={'h-5 w-5'} title={'DateTypeSvg'}>
            <DateTypeSvg></DateTypeSvg>
          </i>
          <i className={'h-5 w-5'} title={'Details2Svg'}>
            <Details2Svg></Details2Svg>
          </i>
          <i className={'h-5 w-5'} title={'DocumentSvg'}>
            <DocumentSvg></DocumentSvg>
          </i>
          <i className={'h-5 w-5'} title={'DragElementSvg'}>
            <DragElementSvg></DragElementSvg>
          </i>
          <i className={'h-5 w-5'} title={'DropDownShowSvg'}>
            <DropDownShowSvg></DropDownShowSvg>
          </i>
          <i className={'h-5 w-5'} title={'EarthSvg'}>
            <EarthSvg></EarthSvg>
          </i>
          <i className={'h-5 w-5'} title={'EditorCheckSvg'}>
            <EditorCheckSvg></EditorCheckSvg>
          </i>
          <i className={'h-5 w-5'} title={'EditorUncheckSvg'}>
            <EditorUncheckSvg></EditorUncheckSvg>
          </i>
          <i className={'h-5 w-5'} title={'EditSvg'}>
            <EditSvg></EditSvg>
          </i>
          <i className={'h-5 w-5'} title={'EyeClosedSvg'}>
            <EyeClosedSvg></EyeClosedSvg>
          </i>
          <i className={'h-5 w-5'} title={'EyeOpenSvg'}>
            <EyeOpenSvg></EyeOpenSvg>
          </i>
          <i className={'h-5 w-5'} title={'FilterSvg'}>
            <FilterSvg></FilterSvg>
          </i>
          <i className={'h-5 w-5'} title={'GridSvg'}>
            <GridSvg></GridSvg>
          </i>
          <i className={'h-5 w-5'} title={'GroupByFieldSvg'}>
            <GroupByFieldSvg></GroupByFieldSvg>
          </i>
          <i className={'h-5 w-5'} title={'HideMenuSvg'}>
            <HideMenuSvg></HideMenuSvg>
          </i>
          <i className={'h-5 w-5'} title={'ImageSvg'}>
            <ImageSvg></ImageSvg>
          </i>
          <i className={'h-5 w-5'} title={'InformationSvg'}>
            <InformationSvg></InformationSvg>
          </i>
          <i className={'h-5 w-5'} title={'LogoutSvg'}>
            <LogoutSvg></LogoutSvg>
          </i>
          <i className={'h-5 w-5'} title={'MoreSvg'}>
            <MoreSvg></MoreSvg>
          </i>
          <i className={'h-5 w-5'} title={'MultiSelectTypeSvg'}>
            <MultiSelectTypeSvg></MultiSelectTypeSvg>
          </i>
          <i className={'h-5 w-5'} title={'NumberTypeSvg'}>
            <NumberTypeSvg></NumberTypeSvg>
          </i>
          <i className={'h-5 w-5'} title={'PropertiesSvg'}>
            <PropertiesSvg></PropertiesSvg>
          </i>
          <i className={'h-5 w-5'} title={'SearchSvg'}>
            <SearchSvg></SearchSvg>
          </i>
          <i className={'h-5 w-5'} title={'ShowMenuSvg'}>
            <ShowMenuSvg></ShowMenuSvg>
          </i>
          <i className={'h-5 w-5'} title={'SingleSelectTypeSvg'}>
            <SingleSelectTypeSvg></SingleSelectTypeSvg>
          </i>
          <i className={'h-5 w-5'} title={'SkipLeftSvg'}>
            <SkipLeftSvg></SkipLeftSvg>
          </i>
          <i className={'h-5 w-5'} title={'SkipRightSvg'}>
            <SkipRightSvg></SkipRightSvg>
          </i>
          <i className={'h-5 w-5'} title={'SortSvg'}>
            <SortSvg></SortSvg>
          </i>
          <i className={'h-5 w-5'} title={'TextTypeSvg'}>
            <TextTypeSvg></TextTypeSvg>
          </i>
          <i className={'h-5 w-5'} title={'TrashSvg'}>
            <TrashSvg></TrashSvg>
          </i>
          <i className={'h-5 w-5'} title={'UrlTypeSvg'}>
            <UrlTypeSvg></UrlTypeSvg>
          </i>
        </div>
      </div>
    </div>
  );
};