refactor

2025-12-19 21:46:11 +05:00 · 2021-06-17 03:28:22 +03:00
parent 3930c26715
commit fd6e227b4f
8 changed files with 107 additions and 47 deletions
--- a/web/src/components/Add/AddDialog.jsx
+++ b/web/src/components/Add/AddDialog.jsx
@@ -9,6 +9,9 @@ import useChangeLanguage from 'utils/useChangeLanguage'
 import { useMediaQuery } from '@material-ui/core'
 import CircularProgress from '@material-ui/core/CircularProgress'
 import usePreviousState from 'utils/usePreviousState'
+import { useQuery } from 'react-query'
+import { getTorrents } from 'utils/Utils'
+import parseTorrent from 'parse-torrent'

 import { checkImageURL, getMoviePosters, chechTorrentSource, parseTorrentTitle } from './helpers'
 import { ButtonWrapper, Content, Header } from './style'
@@ -31,6 +34,7 @@ export default function AddDialog({
  const [posterUrl, setPosterUrl] = useState(originalPoster || '')
  const [isPosterUrlCorrect, setIsPosterUrlCorrect] = useState(false)
  const [isTorrentSourceCorrect, setIsTorrentSourceCorrect] = useState(false)
+  const [isHashAlreadyExists, setIsHashAlreadyExists] = useState(false)
  const [posterList, setPosterList] = useState()
  const [isUserInteractedWithPoster, setIsUserInteractedWithPoster] = useState(isEditMode)
  const [currentLang] = useChangeLanguage()
@@ -40,6 +44,19 @@ export default function AddDialog({
  const [skipDebounce, setSkipDebounce] = useState(false)
  const [isCustomTitleEnabled, setIsCustomTitleEnabled] = useState(false)

+  const { data: torrents } = useQuery('torrents', getTorrents, {
+    retry: 1,
+    refetchInterval: 1000,
+  })
+
+  useEffect(() => {
+    const allHashes = torrents.map(({ hash }) => hash)
+
+    parseTorrent.remote(selectedFile || torrentSource, (err, { infoHash } = {}) => {
+      setIsHashAlreadyExists(allHashes.includes(infoHash))
+    })
+  }, [selectedFile, torrentSource, torrents])
+
  const fullScreen = useMediaQuery('@media (max-width:930px)')

  const updateTitleFromSource = useCallback(() => {
@@ -58,6 +75,7 @@ export default function AddDialog({
    if (!selectedFile && !torrentSource) {
      setTitle('')
      setOriginalTorrentTitle('')
+      setParsedTitle('')
      setIsCustomTitleEnabled(false)
      setPosterList()
      removePoster()
@@ -143,6 +161,7 @@ export default function AddDialog({
      if (parsedTitle) {
        posterSearch(parsedTitle, posterSearchLanguage)
      } else {
+        delayedPosterSearch.cancel()
        !isUserInteractedWithPoster && removePoster()
      }
    } else {
@@ -217,6 +236,7 @@ export default function AddDialog({
          setIsUserInteractedWithPoster={setIsUserInteractedWithPoster}
          setPosterList={setPosterList}
          isTorrentSourceCorrect={isTorrentSourceCorrect}
+          isHashAlreadyExists={isHashAlreadyExists}
          title={title}
          parsedTitle={parsedTitle}
          posterUrl={posterUrl}
@@ -231,6 +251,7 @@ export default function AddDialog({
          torrentSource={torrentSource}
          isCustomTitleEnabled={isCustomTitleEnabled}
          setIsCustomTitleEnabled={setIsCustomTitleEnabled}
+          isEditMode={isEditMode}
        />
      </Content>

@@ -242,7 +263,7 @@ export default function AddDialog({
        <Button
          variant='contained'
          style={{ minWidth: '110px' }}
-          disabled={!torrentSource}
+          disabled={!torrentSource || isHashAlreadyExists || !isTorrentSourceCorrect}
          onClick={handleSave}
          color='primary'
        >
--- a/web/src/components/Add/LeftSideComponent.jsx
+++ b/web/src/components/Add/LeftSideComponent.jsx
@@ -50,8 +50,8 @@ export default function LeftSideComponent({
          onChange={handleTorrentSourceChange}
          value={torrentSource}
          margin='dense'
-          label={t('TorrentSourceLink')}
-          helperText={t('TorrentSourceOptions')}
+          label={t('AddDialog.TorrentSourceLink')}
+          helperText={t('AddDialog.TorrentSourceOptions')}
          type='text'
          fullWidth
          onFocus={() => setIsTorrentSourceActive(true)}
@@ -74,11 +74,11 @@ export default function LeftSideComponent({
      ) : (
        <LeftSideBottomSectionNoFile isDragActive={isDragActive} {...getRootProps()}>
          <input {...getInputProps()} />
-          <div>{t('AppendFile.Or')}</div>
+          <div>{t('AddDialog.AppendFile.Or')}</div>

          <IconWrapper>
            <AddItemIcon color='primary' />
-            <div>{t('AppendFile.ClickOrDrag')}</div>
+            <div>{t('AddDialog.AppendFile.ClickOrDrag')}</div>
          </IconWrapper>
        </LeftSideBottomSectionNoFile>
      )}
--- a/web/src/components/Add/RightSideComponent.jsx
+++ b/web/src/components/Add/RightSideComponent.jsx
@@ -22,6 +22,7 @@ export default function RightSideComponent({
  setIsUserInteractedWithPoster,
  setPosterList,
  isTorrentSourceCorrect,
+  isHashAlreadyExists,
  title,
  parsedTitle,
  posterUrl,
@@ -37,6 +38,7 @@ export default function RightSideComponent({
  updateTitleFromSource,
  isCustomTitleEnabled,
  setIsCustomTitleEnabled,
+  isEditMode,
 }) {
  const { t } = useTranslation()

@@ -55,14 +57,13 @@ export default function RightSideComponent({

  return (
    <RightSide>
-      <RightSideContainer isHidden={!isTorrentSourceCorrect}>
+      <RightSideContainer isHidden={!isTorrentSourceCorrect || (isHashAlreadyExists && !isEditMode)}>
        {originalTorrentTitle ? (
          <>
            <TextField
              value={originalTorrentTitle}
              margin='dense'
-              // label={t('Title')}
-              label='Оригинальное название торрента'
+              label={t('AddDialog.OriginalTorrentTitle')}
              type='text'
              fullWidth
              disabled={isCustomTitleEnabled}
@@ -74,7 +75,7 @@ export default function RightSideComponent({
              onBlur={({ target: { value } }) => !value && setIsCustomTitleEnabled(false)}
              value={title}
              margin='dense'
-              label='Использовать свое название (не обязательно)'
+              label={t('AddDialog.CustomTorrentTitle')}
              type='text'
              fullWidth
              InputProps={{
@@ -101,7 +102,7 @@ export default function RightSideComponent({
            onChange={handleTitleChange}
            value={title}
            margin='dense'
-            label='Использовать свое название (не обязательно)'
+            label={t('AddDialog.TitleBlank')}
            type='text'
            fullWidth
          />
@@ -110,7 +111,7 @@ export default function RightSideComponent({
          onChange={handlePosterUrlChange}
          value={posterUrl}
          margin='dense'
-          label={t('AddPosterLinkInput')}
+          label={t('AddDialog.AddPosterLinkInput')}
          type='url'
          fullWidth
        />
@@ -165,11 +166,15 @@ export default function RightSideComponent({
      </RightSideContainer>

      <RightSideContainer
-        isError={torrentSource && !isTorrentSourceCorrect}
+        isError={torrentSource && (!isTorrentSourceCorrect || isHashAlreadyExists)}
        notificationMessage={
-          !torrentSource ? t('AddTorrentSourceNotification') : !isTorrentSourceCorrect && t('WrongTorrentSource')
+          !torrentSource
+            ? t('AddDialog.AddTorrentSourceNotification')
+            : !isTorrentSourceCorrect
+            ? t('AddDialog.WrongTorrentSource')
+            : isHashAlreadyExists && t('AddDialog.HashExists')
        }
-        isHidden={isTorrentSourceCorrect}
+        isHidden={isEditMode || (isTorrentSourceCorrect && !isHashAlreadyExists)}
      />
    </RightSide>
  )
--- a/web/src/components/Add/style.js
+++ b/web/src/components/Add/style.js
@@ -30,6 +30,10 @@ export const Content = styled.div`
    @media (max-width: 930px) {
      grid-template-columns: 1fr;
    }
+
+    @media (max-width: 500px) {
+      align-content: start;
+    }
  `}
 `

@@ -66,6 +70,10 @@ export const RightSideContainer = styled.div`
    css`
      display: none;
    `};
+
+    @media (max-width: 500px) {
+      height: 170px;
+    }
  `}
 `
 export const LeftSide = styled.div`
@@ -105,6 +113,15 @@ export const LeftSideBottomSectionNoFile = styled.div`
    place-items: center;
    grid-template-rows: 40% 1fr;
  }
+
+  @media (max-width: 500px) {
+    height: 170px;
+    grid-template-rows: 1fr;
+
+    > div:first-of-type {
+      display: none;
+    }
+  }
 `

 export const LeftSideBottomSectionFileSelected = styled.div`
@@ -114,6 +131,10 @@ export const LeftSideBottomSectionFileSelected = styled.div`
  @media (max-width: 930px) {
    height: 400px;
  }
+
+  @media (max-width: 500px) {
+    height: 170px;
+  }
 `

 export const TorrentIconWrapper = styled.div`
--- a/web/src/components/TorrentList.jsx
+++ b/web/src/components/TorrentList.jsx
@@ -1,21 +1,11 @@
 import { useState } from 'react'
 import { Typography } from '@material-ui/core'
-import { torrentsHost } from 'utils/Hosts'
 import TorrentCard from 'components/TorrentCard'
-import axios from 'axios'
 import CircularProgress from '@material-ui/core/CircularProgress'
 import { TorrentListWrapper, CenteredGrid } from 'components/App/style'
 import { useTranslation } from 'react-i18next'
 import { useQuery } from 'react-query'
-
-const getTorrents = async () => {
-  try {
-    const { data } = await axios.post(torrentsHost(), { action: 'list' })
-    return data
-  } catch (error) {
-    throw new Error(null)
-  }
-}
+import { getTorrents } from 'utils/Utils'

 export default function TorrentList() {
  const { t } = useTranslation()
--- a/web/src/locales/en/translation.json
+++ b/web/src/locales/en/translation.json
@@ -2,15 +2,24 @@
  "About": "About",
  "Actions": "Actions",
  "Add": "Add",
+  "AddDialog": {
+    "AddPosterLinkInput": "Poster link",
+    "AddTorrentSourceNotification": "First add your torrent source",
+    "AppendFile": {
+      "Or": "OR",
+      "ClickOrDrag": "CLICK / DRAG & DROP (.torrent)"
+    },
+    "CustomTorrentTitle": "Custom title (optional)",
+    "HashExists": "This torrent is already in database",
+    "OriginalTorrentTitle": "Original torrent title",
+    "TitleBlank": "Title (blank for orig. torrent title)",
+    "TorrentSourceLink": "Torrent source link",
+    "TorrentSourceOptions": "magnet / hash / .torrent file link",
+    "WrongTorrentSource": "Wrong torrent source"
+  },
  "AddFromLink": "Add from Link",
  "AddNewTorrent": "Add new torrent",
-  "AddPosterLinkInput": "Poster link",
  "AddRetrackers": "Add retrackers",
-  "AddTorrentSourceNotification": "First add your torrent source",
-  "AppendFile": {
-    "Or": "OR",
-    "ClickOrDrag": "CLICK / DRAG & DROP (.torrent)"
-  },
  "Buffer": "Preload Buffer / Cache",
  "BufferNote": "Enable “Preload Buffer” in settings to see cache loading progress",
  "Cache": "Cache",
@@ -85,7 +94,6 @@
  "Support": "Support",
  "TCP": "TCP (Transmission Control Protocol)",
  "ThanksToEveryone": "Thanks to everyone who tested and helped.",
-  "Title": "Title",
  "TorrentAdded": "Added",
  "TorrentClosed": "Сlosed",
  "TorrentContent": "Torrent Content",
@@ -95,8 +103,6 @@
  "TorrentInDb": "In DB",
  "TorrentPreload": "Preload",
  "TorrentSize": "Torrent size",
-  "TorrentSourceLink": "Torrent source link",
-  "TorrentSourceOptions": "magnet / hash / .torrent file link",
  "TorrentsSavePath": "Torrents Save Path",
  "TorrentState": "Torrent State",
  "TorrentStatus": "Torrent Status",
@@ -110,6 +116,5 @@
  "UseDisk": "Use Disk for Cache",
  "UseDiskDesc": "Better use external media on flash-based devices",
  "UTP": "μTP (Micro Transport Protocol)",
-  "Viewed": "Viewed",
-  "WrongTorrentSource": "Wrong torrent source"
+  "Viewed": "Viewed"
 }
--- a/web/src/locales/ru/translation.json
+++ b/web/src/locales/ru/translation.json
@@ -2,15 +2,24 @@
  "About": "О сервере",
  "Actions": "Действия",
  "Add": "Добавить",
+  "AddDialog": {
+    "AddPosterLinkInput": "Ссылка на постер",
+    "AddTorrentSourceNotification": "Сначала добавьте torrent-источник",
+    "AppendFile": {
+      "Or": "ИЛИ",
+      "ClickOrDrag": "НАЖМИТЕ / ПЕРЕТАЩИТЕ ФАЙЛ (.torrent)"
+    },
+    "CustomTorrentTitle": "Cвое имя (не обязательно)",
+    "HashExists": "Этот торрент уже есть в базе данных",
+    "OriginalTorrentTitle": "Оригинальное имя торрента",
+    "TitleBlank": "Имя (пустое - ориг. имя торрента)",
+    "TorrentSourceLink": "Ссылка на источник торрента",
+    "TorrentSourceOptions": "magnet-ссылка / хеш / ссылка на .torrent файл",
+    "WrongTorrentSource": "Неправильный torrent-источник"
+  },
  "AddFromLink": "Добавить",
  "AddNewTorrent": "Добавить новый торрент",
-  "AddPosterLinkInput": "Ссылка на постер",
  "AddRetrackers": "Добавлять",
-  "AddTorrentSourceNotification": "Сначала добавьте torrent-источник",
-  "AppendFile": {
-    "Or": "ИЛИ",
-    "ClickOrDrag": "НАЖМИТЕ / ПЕРЕТАЩИТЕ ФАЙЛ (.torrent)"
-  },
  "Buffer": "Предзагрузка / Кеш",
  "BufferNote": "Включите «Наполнять кеш перед началом воспроизведения» в настройках для показа заполнения кеша",
  "Cache": "Кеш",
@@ -85,7 +94,6 @@
  "Support": "Поддержать",
  "TCP": "TCP (Transmission Control Protocol)",
  "ThanksToEveryone": "Спасибо всем, кто тестировал и помогал!",
-  "Title": "Название",
  "TorrentAdded": "Добавлен",
  "TorrentClosed": "Закрыт",
  "TorrentContent": "Содержимое торрента",
@@ -95,8 +103,6 @@
  "TorrentInDb": "Торрент в БД",
  "TorrentPreload": "Предзагрузка",
  "TorrentSize": "Размер торрента",
-  "TorrentSourceLink": "Ссылка на источник торрента",
-  "TorrentSourceOptions": "magnet-ссылка / хеш / ссылка на .torrent файл",
  "TorrentsSavePath": "Путь хранения кеша",
  "TorrentState": "Данные торрента",
  "TorrentStatus": "Состояние торрента",
@@ -110,6 +116,5 @@
  "UseDisk": "Использовать диск для кеша",
  "UseDiskDesc": "Рекомендуется использовать внешние носители на устройствах с flash-памятью",
  "UTP": "μTP (Micro Transport Protocol)",
-  "Viewed": "Просм.",
-  "WrongTorrentSource": "Неправильный torrent-источник"
+  "Viewed": "Просм."
 }
--- a/web/src/utils/Utils.js
+++ b/web/src/utils/Utils.js
@@ -1,3 +1,7 @@
+import axios from 'axios'
+
+import { torrentsHost } from './Hosts'
+
 export function humanizeSize(size) {
  if (!size) return ''
  const i = Math.floor(Math.log(size) / Math.log(1024))
@@ -41,3 +45,12 @@ export const removeRedundantCharacters = string => {

  return hasThreeDotsAtTheEnd ? `${trimmedString}..` : trimmedString
 }
+
+export const getTorrents = async () => {
+  try {
+    const { data } = await axios.post(torrentsHost(), { action: 'list' })
+    return data
+  } catch (error) {
+    throw new Error(null)
+  }
+}