Lint all files

src/renderer/features/search/components/library-command-item.tsx

@@ -1,12 +1,12 @@
 import { Center, Flex } from '@mantine/core';
 import { useCallback, MouseEvent } from 'react';
 import {
-  RiAddBoxFill,
-  RiAddCircleFill,
-  RiAlbumFill,
-  RiPlayFill,
-  RiPlayListFill,
-  RiUserVoiceFill,
+    RiAddBoxFill,
+    RiAddCircleFill,
+    RiAlbumFill,
+    RiPlayFill,
+    RiPlayListFill,
+    RiUserVoiceFill,
 } from 'react-icons/ri';
 import styled from 'styled-components';
 import { LibraryItem } from '/@/renderer/api/types';
@@ -16,168 +16,168 @@ import { Play, PlayQueueAddOptions } from '/@/renderer/types';
 const Item = styled(Flex)``;
 
 const ItemGrid = styled.div<{ height: number }>`
-  display: grid;
-  grid-auto-columns: 1fr;
-  grid-template-areas: 'image info';
-  grid-template-rows: 1fr;
-  grid-template-columns: ${(props) => props.height}px minmax(0, 1fr);
-  gap: 0.5rem;
-  width: 100%;
-  max-width: 100%;
-  height: 100%;
-  letter-spacing: 0.5px;
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-areas: 'image info';
+    grid-template-rows: 1fr;
+    grid-template-columns: ${(props) => props.height}px minmax(0, 1fr);
+    gap: 0.5rem;
+    width: 100%;
+    max-width: 100%;
+    height: 100%;
+    letter-spacing: 0.5px;
 `;
 
 const ImageWrapper = styled.div`
-  display: flex;
-  grid-area: image;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
+    display: flex;
+    grid-area: image;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
 `;
 
 const MetadataWrapper = styled.div`
-  display: flex;
-  flex-direction: column;
-  grid-area: info;
-  justify-content: center;
-  width: 100%;
+    display: flex;
+    flex-direction: column;
+    grid-area: info;
+    justify-content: center;
+    width: 100%;
 `;
 
 const StyledImage = styled.img`
-  object-fit: cover;
-  border-radius: 4px;
+    object-fit: cover;
+    border-radius: 4px;
 `;
 
 const ActionsContainer = styled(Flex)``;
 
 interface LibraryCommandItemProps {
-  handlePlayQueueAdd?: (options: PlayQueueAddOptions) => void;
-  id: string;
-  imageUrl: string | null;
-  itemType: LibraryItem;
-  subtitle?: string;
-  title?: string;
+    handlePlayQueueAdd?: (options: PlayQueueAddOptions) => void;
+    id: string;
+    imageUrl: string | null;
+    itemType: LibraryItem;
+    subtitle?: string;
+    title?: string;
 }
 
 export const LibraryCommandItem = ({
-  id,
-  imageUrl,
-  subtitle,
-  title,
-  itemType,
-  handlePlayQueueAdd,
+    id,
+    imageUrl,
+    subtitle,
+    title,
+    itemType,
+    handlePlayQueueAdd,
 }: LibraryCommandItemProps) => {
-  let Placeholder = RiAlbumFill;
+    let Placeholder = RiAlbumFill;
 
-  switch (itemType) {
-    case LibraryItem.ALBUM:
-      Placeholder = RiAlbumFill;
-      break;
-    case LibraryItem.ARTIST:
-      Placeholder = RiUserVoiceFill;
-      break;
-    case LibraryItem.ALBUM_ARTIST:
-      Placeholder = RiUserVoiceFill;
-      break;
-    case LibraryItem.PLAYLIST:
-      Placeholder = RiPlayListFill;
-      break;
-    default:
-      Placeholder = RiAlbumFill;
-      break;
-  }
+    switch (itemType) {
+        case LibraryItem.ALBUM:
+            Placeholder = RiAlbumFill;
+            break;
+        case LibraryItem.ARTIST:
+            Placeholder = RiUserVoiceFill;
+            break;
+        case LibraryItem.ALBUM_ARTIST:
+            Placeholder = RiUserVoiceFill;
+            break;
+        case LibraryItem.PLAYLIST:
+            Placeholder = RiPlayListFill;
+            break;
+        default:
+            Placeholder = RiAlbumFill;
+            break;
+    }
 
-  const handlePlay = useCallback(
-    (e: MouseEvent, id: string, playType: Play) => {
-      e.stopPropagation();
-      handlePlayQueueAdd?.({
-        byItemType: {
-          id: [id],
-          type: itemType,
+    const handlePlay = useCallback(
+        (e: MouseEvent, id: string, playType: Play) => {
+            e.stopPropagation();
+            handlePlayQueueAdd?.({
+                byItemType: {
+                    id: [id],
+                    type: itemType,
+                },
+                playType,
+            });
         },
-        playType,
-      });
-    },
-    [handlePlayQueueAdd, itemType],
-  );
+        [handlePlayQueueAdd, itemType],
+    );
 
-  return (
-    <Item
-      gap="xl"
-      justify="space-between"
-      style={{ height: '40px', width: '100%' }}
-    >
-      <ItemGrid height={40}>
-        <ImageWrapper>
-          {imageUrl ? (
-            <StyledImage
-              alt="cover"
-              height={40}
-              placeholder="var(--placeholder-bg)"
-              src={imageUrl}
-              style={{}}
-              width={40}
-            />
-          ) : (
-            <Center
-              style={{
-                background: 'var(--placeholder-bg)',
-                borderRadius: 'var(--card-default-radius)',
-                height: `${40}px`,
-                width: `${40}px`,
-              }}
+    return (
+        <Item
+            gap="xl"
+            justify="space-between"
+            style={{ height: '40px', width: '100%' }}
+        >
+            <ItemGrid height={40}>
+                <ImageWrapper>
+                    {imageUrl ? (
+                        <StyledImage
+                            alt="cover"
+                            height={40}
+                            placeholder="var(--placeholder-bg)"
+                            src={imageUrl}
+                            style={{}}
+                            width={40}
+                        />
+                    ) : (
+                        <Center
+                            style={{
+                                background: 'var(--placeholder-bg)',
+                                borderRadius: 'var(--card-default-radius)',
+                                height: `${40}px`,
+                                width: `${40}px`,
+                            }}
+                        >
+                            <Placeholder
+                                color="var(--placeholder-fg)"
+                                size={35}
+                            />
+                        </Center>
+                    )}
+                </ImageWrapper>
+                <MetadataWrapper>
+                    <Text overflow="hidden">{title}</Text>
+                    <Text
+                        $secondary
+                        overflow="hidden"
+                    >
+                        {subtitle}
+                    </Text>
+                </MetadataWrapper>
+            </ItemGrid>
+            <ActionsContainer
+                align="center"
+                gap="sm"
+                justify="flex-end"
             >
-              <Placeholder
-                color="var(--placeholder-fg)"
-                size={35}
-              />
-            </Center>
-          )}
-        </ImageWrapper>
-        <MetadataWrapper>
-          <Text overflow="hidden">{title}</Text>
-          <Text
-            $secondary
-            overflow="hidden"
-          >
-            {subtitle}
-          </Text>
-        </MetadataWrapper>
-      </ItemGrid>
-      <ActionsContainer
-        align="center"
-        gap="sm"
-        justify="flex-end"
-      >
-        <Button
-          compact
-          size="md"
-          tooltip={{ label: 'Play', openDelay: 500 }}
-          variant="default"
-          onClick={(e) => handlePlay(e, id, Play.NOW)}
-        >
-          <RiPlayFill />
-        </Button>
-        <Button
-          compact
-          size="md"
-          tooltip={{ label: 'Add to queue', openDelay: 500 }}
-          variant="default"
-          onClick={(e) => handlePlay(e, id, Play.LAST)}
-        >
-          <RiAddBoxFill />
-        </Button>
-        <Button
-          compact
-          size="md"
-          tooltip={{ label: 'Play next', openDelay: 500 }}
-          variant="default"
-          onClick={(e) => handlePlay(e, id, Play.NEXT)}
-        >
-          <RiAddCircleFill />
-        </Button>
-      </ActionsContainer>
-    </Item>
-  );
+                <Button
+                    compact
+                    size="md"
+                    tooltip={{ label: 'Play', openDelay: 500 }}
+                    variant="default"
+                    onClick={(e) => handlePlay(e, id, Play.NOW)}
+                >
+                    <RiPlayFill />
+                </Button>
+                <Button
+                    compact
+                    size="md"
+                    tooltip={{ label: 'Add to queue', openDelay: 500 }}
+                    variant="default"
+                    onClick={(e) => handlePlay(e, id, Play.LAST)}
+                >
+                    <RiAddBoxFill />
+                </Button>
+                <Button
+                    compact
+                    size="md"
+                    tooltip={{ label: 'Play next', openDelay: 500 }}
+                    variant="default"
+                    onClick={(e) => handlePlay(e, id, Play.NEXT)}
+                >
+                    <RiAddCircleFill />
+                </Button>
+            </ActionsContainer>
+        </Item>
+    );
 };