![\"All](\"https://img.shields.io/badge/all_contributors-<%=){kind=icon}
-orange.svg\"/>-orange.svg\"/>",
diff --git a/.github/holopin.yml b/.github/holopin.yml
new file mode 100644
index 000000000..ee4edc81b
--- /dev/null
+++ b/.github/holopin.yml
@@ -0,0 +1,5 @@
+organization: overseerr
+defaultSticker: clcyagj1j329008l468ya8pu2
+stickers:
+ - id: clcyagj1j329008l468ya8pu2
+ alias: overseerr-contributor
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index d2026ee71..b4c88ba9c 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -91,9 +91,9 @@ jobs:
run: |
failures=(neutral, skipped, timed_out, action_required)
if [[ ${array[@]} =~ $WORKFLOW_CONCLUSION ]]; then
- echo ::set-output name=status::failure
+ echo "status=failure" >> $GITHUB_OUTPUT
else
- echo ::set-output name=status::$WORKFLOW_CONCLUSION
+ echo "status=$WORKFLOW_CONCLUSION" >> $GITHUB_OUTPUT
fi
- name: Post Status to Discord
uses: sarisia/actions-status-discord@v1
diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml
new file mode 100644
index 000000000..10926bbd9
--- /dev/null
+++ b/.github/workflows/codeql.yml
@@ -0,0 +1,41 @@
+name: 'CodeQL'
+
+on:
+ push:
+ branches: ['develop']
+ pull_request:
+ branches: ['develop']
+ schedule:
+ - cron: '50 7 * * 5'
+
+jobs:
+ analyze:
+ name: Analyze
+ runs-on: ubuntu-latest
+ permissions:
+ actions: read
+ contents: read
+ security-events: write
+
+ strategy:
+ fail-fast: false
+ matrix:
+ language: [javascript]
+
+ steps:
+ - name: Checkout
+ uses: actions/checkout@v3
+
+ - name: Initialize CodeQL
+ uses: github/codeql-action/init@v2
+ with:
+ languages: ${{ matrix.language }}
+ queries: +security-and-quality
+
+ - name: Autobuild
+ uses: github/codeql-action/autobuild@v2
+
+ - name: Perform CodeQL Analysis
+ uses: github/codeql-action/analyze@v2
+ with:
+ category: '/language:${{ matrix.language }}'
diff --git a/.github/workflows/preview.yml b/.github/workflows/preview.yml
index 35ae768b7..3797936af 100644
--- a/.github/workflows/preview.yml
+++ b/.github/workflows/preview.yml
@@ -14,7 +14,7 @@ jobs:
uses: actions/checkout@v3
- name: Get the version
id: get_version
- run: echo ::set-output name=VERSION::${GITHUB_REF#refs/tags/}
+ run: echo "VERSION=${GITHUB_REF#refs/tags/}" >> $GITHUB_OUTPUT
- name: Set up QEMU
uses: docker/setup-qemu-action@v2
- name: Set up Docker Buildx
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 0eb04b391..2a34fb9fc 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -59,10 +59,10 @@ jobs:
id: prepare
run: |
git fetch --prune --tags
- if [[ $GITHUB_REF == refs/tags/* || $GITHUB_REF == refs/heads/main ]]; then
- echo ::set-output name=RELEASE::stable
+ if [[ $GITHUB_REF == refs/tags/* || $GITHUB_REF == refs/heads/master ]]; then
+ echo "RELEASE=stable" >> $GITHUB_OUTPUT
else
- echo ::set-output name=RELEASE::edge
+ echo "RELEASE=edge" >> $GITHUB_OUTPUT
fi
- name: Set Up QEMU
uses: docker/setup-qemu-action@v1
@@ -84,8 +84,9 @@ jobs:
snap: ${{ steps.build.outputs.snap }}
- name: Publish Snap Package
uses: snapcore/action-publish@v1
+ env:
+ SNAPCRAFT_STORE_CREDENTIALS: ${{ secrets.SNAP_LOGIN }}
with:
- store_login: ${{ secrets.SNAP_LOGIN }}
snap: ${{ steps.build.outputs.snap }}
release: ${{ steps.prepare.outputs.RELEASE }}
@@ -102,9 +103,9 @@ jobs:
run: |
failures=(neutral, skipped, timed_out, action_required)
if [[ ${array[@]} =~ $WORKFLOW_CONCLUSION ]]; then
- echo ::set-output name=status::failure
+ echo "status=failure" >> $GITHUB_OUTPUT
else
- echo ::set-output name=status::$WORKFLOW_CONCLUSION
+ echo "status=$WORKFLOW_CONCLUSION" >> $GITHUB_OUTPUT
fi
- name: Post Status to Discord
uses: sarisia/actions-status-discord@v1
diff --git a/.github/workflows/snap.yaml b/.github/workflows/snap.yaml
index 63f6555c7..4039c58e2 100644
--- a/.github/workflows/snap.yaml
+++ b/.github/workflows/snap.yaml
@@ -35,9 +35,9 @@ jobs:
run: |
git fetch --prune --unshallow --tags
if [[ $GITHUB_REF == refs/tags/* || $GITHUB_REF == refs/heads/master ]]; then
- echo ::set-output name=RELEASE::stable
+ echo "RELEASE=stable" >> $GITHUB_OUTPUT
else
- echo ::set-output name=RELEASE::edge
+ echo "RELEASE=edge" >> $GITHUB_OUTPUT
fi
- name: Set Up QEMU
uses: docker/setup-qemu-action@v2
@@ -57,8 +57,9 @@ jobs:
snap: ${{ steps.build.outputs.snap }}
- name: Publish Snap Package
uses: snapcore/action-publish@v1
+ env:
+ SNAPCRAFT_STORE_CREDENTIALS: ${{ secrets.SNAP_LOGIN }}
with:
- store_login: ${{ secrets.SNAP_LOGIN }}
snap: ${{ steps.build.outputs.snap }}
release: ${{ steps.prepare.outputs.RELEASE }}
@@ -75,9 +76,9 @@ jobs:
run: |
failures=(neutral, skipped, timed_out, action_required)
if [[ ${array[@]} =~ $WORKFLOW_CONCLUSION ]]; then
- echo ::set-output name=status::failure
+ echo "status=failure" >> $GITHUB_OUTPUT
else
- echo ::set-output name=status::$WORKFLOW_CONCLUSION
+ echo "status=$WORKFLOW_CONCLUSION" >> $GITHUB_OUTPUT
fi
- name: Post Status to Discord
uses: sarisia/actions-status-discord@v1
diff --git a/README.md b/README.md
index 5f0d9da78..77a6b3193 100644
--- a/README.md
+++ b/README.md
@@ -141,3 +141,130 @@ Our [Code of Conduct](https://github.com/fallenbagel/jellyseerr/blob/develop/COD
## Contributing
You can help improve Jellyseerr too! Check out our [Contribution Guide](https://github.com/fallenbagel/jellyseerr/blob/develop/CONTRIBUTING.md) to get started.
+
+## Contributors ✨
+
+Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
+
+
+
+
+(
ref?: React.Ref (
break;
case 'ghost':
buttonStyle.push(
- 'text-white bg-transaprent border-gray-600 hover:border-gray-200 focus:border-gray-100 active:border-gray-100'
+ 'text-white bg-transparent border-gray-600 hover:border-gray-200 focus:border-gray-100 active:border-gray-100'
);
break;
default:
diff --git a/src/components/Common/ButtonWithDropdown/index.tsx b/src/components/Common/ButtonWithDropdown/index.tsx
index be6815b94..b5bc0cb64 100644
--- a/src/components/Common/ButtonWithDropdown/index.tsx
+++ b/src/components/Common/ButtonWithDropdown/index.tsx
@@ -1,7 +1,7 @@
import useClickOutside from '@app/hooks/useClickOutside';
import { withProperties } from '@app/utils/typeHelpers';
import { Transition } from '@headlessui/react';
-import { ChevronDownIcon } from '@heroicons/react/solid';
+import { ChevronDownIcon } from '@heroicons/react/24/solid';
import type { AnchorHTMLAttributes, ButtonHTMLAttributes } from 'react';
import { Fragment, useRef, useState } from 'react';
diff --git a/src/components/Common/ConfirmButton/index.tsx b/src/components/Common/ConfirmButton/index.tsx
index 1f5756cb9..4234da68a 100644
--- a/src/components/Common/ConfirmButton/index.tsx
+++ b/src/components/Common/ConfirmButton/index.tsx
@@ -1,6 +1,6 @@
import Button from '@app/components/Common/Button';
import useClickOutside from '@app/hooks/useClickOutside';
-import { useRef, useState } from 'react';
+import { forwardRef, useRef, useState } from 'react';
interface ConfirmButtonProps {
onClick: () => void;
@@ -9,50 +9,51 @@ interface ConfirmButtonProps {
children: React.ReactNode;
}
-const ConfirmButton = ({
- onClick,
- children,
- confirmText,
- className,
-}: ConfirmButtonProps) => {
- const ref = useRef(null);
- useClickOutside(ref, () => setIsClicked(false));
- const [isClicked, setIsClicked] = useState(false);
- return (
-
+ );
+ }
+);
+
+ConfirmButton.displayName = 'ConfirmButton';
export default ConfirmButton;
diff --git a/src/components/Common/MultiRangeSlider/index.tsx b/src/components/Common/MultiRangeSlider/index.tsx
new file mode 100644
index 000000000..c3da2b577
--- /dev/null
+++ b/src/components/Common/MultiRangeSlider/index.tsx
@@ -0,0 +1,113 @@
+import Tooltip from '@app/components/Common/Tooltip';
+import useDebouncedState from '@app/hooks/useDebouncedState';
+import { useEffect, useRef } from 'react';
+
+type MultiRangeSliderProps = {
+ min: number;
+ max: number;
+ defaultMinValue?: number;
+ defaultMaxValue?: number;
+ subText?: string;
+ onUpdateMin: (min: number) => void;
+ onUpdateMax: (max: number) => void;
+};
+
+const MultiRangeSlider = ({
+ min,
+ max,
+ defaultMinValue,
+ defaultMaxValue,
+ subText,
+ onUpdateMin,
+ onUpdateMax,
+}: MultiRangeSliderProps) => {
+ const touched = useRef(false);
+ const [valueMin, finalValueMin, setValueMin] = useDebouncedState(
+ defaultMinValue ?? min
+ );
+ const [valueMax, finalValueMax, setValueMax] = useDebouncedState(
+ defaultMaxValue ?? max
+ );
+
+ const minThumb = ((valueMin - min) / (max - min)) * 100;
+ const maxThumb = ((valueMax - min) / (max - min)) * 100;
+
+ useEffect(() => {
+ if (touched.current) {
+ onUpdateMin(finalValueMin);
+ }
+ }, [finalValueMin, onUpdateMin]);
+
+ useEffect(() => {
+ if (touched.current) {
+ onUpdateMax(finalValueMax);
+ }
+ }, [finalValueMax, onUpdateMax]);
+
+ useEffect(() => {
+ touched.current = false;
+ setValueMax(defaultMaxValue ?? max);
+ setValueMin(defaultMinValue ?? min);
+ }, [defaultMinValue, defaultMaxValue, setValueMax, setValueMin, min, max]);
+
+ return (
+
+
+ );
+};
+
+export default MultiRangeSlider;
diff --git a/src/components/Common/SensitiveInput/index.tsx b/src/components/Common/SensitiveInput/index.tsx
index 6652f5519..ae11b9517 100644
--- a/src/components/Common/SensitiveInput/index.tsx
+++ b/src/components/Common/SensitiveInput/index.tsx
@@ -1,4 +1,4 @@
-import { EyeIcon, EyeOffIcon } from '@heroicons/react/solid';
+import { EyeIcon, EyeSlashIcon } from '@heroicons/react/24/solid';
import { Field } from 'formik';
import { useState } from 'react';
@@ -43,7 +43,7 @@ const SensitiveInput = ({ as = 'input', ...props }: SensitiveInputProps) => {
type="button"
className="input-action"
>
- {isHidden ?
+ {subText}
+
+ )}
+ e.stopPropagation()}
>
-
diff --git a/src/components/Common/StatusBadgeMini/index.tsx b/src/components/Common/StatusBadgeMini/index.tsx
index 0653c7d80..a7e24a378 100644
--- a/src/components/Common/StatusBadgeMini/index.tsx
+++ b/src/components/Common/StatusBadgeMini/index.tsx
@@ -1,41 +1,67 @@
-import {
- BellIcon,
- CheckIcon,
- ClockIcon,
- MinusSmIcon,
-} from '@heroicons/react/solid';
+import Spinner from '@app/assets/spinner.svg';
+import { CheckCircleIcon } from '@heroicons/react/20/solid';
+import { BellIcon, ClockIcon, MinusSmallIcon } from '@heroicons/react/24/solid';
import { MediaStatus } from '@server/constants/media';
interface StatusBadgeMiniProps {
status: MediaStatus;
is4k?: boolean;
+ inProgress?: boolean;
+ // Should the badge shrink on mobile to a smaller size? (TitleCard)
+ shrink?: boolean;
}
-const StatusBadgeMini = ({ status, is4k = false }: StatusBadgeMiniProps) => {
- const badgeStyle = ['w-5 rounded-full p-0.5 text-white ring-1'];
+const StatusBadgeMini = ({
+ status,
+ is4k = false,
+ inProgress = false,
+ shrink = false,
+}: StatusBadgeMiniProps) => {
+ const badgeStyle = [
+ `rounded-full bg-opacity-80 shadow-md ${
+ shrink ? 'w-4 sm:w-5 border p-0' : 'w-5 ring-1 p-0.5'
+ }`,
+ ];
+
let indicatorIcon: React.ReactNode;
switch (status) {
case MediaStatus.PROCESSING:
- badgeStyle.push('bg-indigo-500 ring-indigo-400');
+ badgeStyle.push(
+ 'bg-indigo-500 border-indigo-400 ring-indigo-400 text-indigo-100'
+ );
indicatorIcon =
+
)}
-
@@ -95,8 +95,10 @@ const SlideOver = ({
@@ -83,7 +83,7 @@ const SlideOver = ({
className="text-gray-200 transition duration-150 ease-in-out hover:text-white"
onClick={() => onClose()}
>
-
- {children}
+
+
+ {children}
+
+
@@ -43,7 +43,7 @@ const MovieGenreSlider = () => {
image={`https://image.tmdb.org/t/p/w1280_filter(duotone,${
genreColorMap[genre.id] ?? genreColorMap[0]
})${genre.backdrops[4]}`}
- url={`/discover/movies/genre/${genre.id}`}
+ url={`/discover/movies?genre=${genre.id}`}
/>
))}
placeholder={
diff --git a/src/components/Common/Tag/index.tsx b/src/components/Common/Tag/index.tsx
new file mode 100644
index 000000000..dcb426d40
--- /dev/null
+++ b/src/components/Common/Tag/index.tsx
@@ -0,0 +1,24 @@
+import { TagIcon } from '@heroicons/react/24/outline';
+import React from 'react';
+
+type TagProps = {
+ children: React.ReactNode;
+ iconSvg?: JSX.Element;
+};
+
+const Tag = ({ children, iconSvg }: TagProps) => {
+ return (
+ {indicatorIcon}
{is4k && 4K}
+ {iconSvg ? (
+ React.cloneElement(iconSvg, {
+ className: 'mr-1 h-4 w-4',
+ })
+ ) : (
+
+ );
+};
+
+export default Tag;
diff --git a/src/components/CompanyTag/index.tsx b/src/components/CompanyTag/index.tsx
new file mode 100644
index 000000000..7c49b8cca
--- /dev/null
+++ b/src/components/CompanyTag/index.tsx
@@ -0,0 +1,28 @@
+import Spinner from '@app/assets/spinner.svg';
+import Tag from '@app/components/Common/Tag';
+import { BuildingOffice2Icon } from '@heroicons/react/24/outline';
+import type { ProductionCompany, TvNetwork } from '@server/models/common';
+import useSWR from 'swr';
+
+type CompanyTagProps = {
+ type: 'studio' | 'network';
+ companyId: number;
+};
+
+const CompanyTag = ({ companyId, type }: CompanyTagProps) => {
+ const { data, error } = useSWR
+
+
+
+
+
+
+
+
+
+
+ {hoverPosition === Position.Above && (
+
+ )}
+ {hoverPosition === Position.Below && (
+
+ )}
+
+ );
+};
+
+export default DiscoverSliderEdit;
diff --git a/src/components/Discover/DiscoverTv/index.tsx b/src/components/Discover/DiscoverTv/index.tsx
new file mode 100644
index 000000000..527393676
--- /dev/null
+++ b/src/components/Discover/DiscoverTv/index.tsx
@@ -0,0 +1,145 @@
+import Button from '@app/components/Common/Button';
+import Header from '@app/components/Common/Header';
+import ListView from '@app/components/Common/ListView';
+import PageTitle from '@app/components/Common/PageTitle';
+import type { FilterOptions } from '@app/components/Discover/constants';
+import {
+ countActiveFilters,
+ prepareFilterValues,
+} from '@app/components/Discover/constants';
+import FilterSlideover from '@app/components/Discover/FilterSlideover';
+import useDiscover from '@app/hooks/useDiscover';
+import { useUpdateQueryParams } from '@app/hooks/useUpdateQueryParams';
+import Error from '@app/pages/_error';
+import { BarsArrowDownIcon, FunnelIcon } from '@heroicons/react/24/solid';
+import type { SortOptions as TMDBSortOptions } from '@server/api/themoviedb';
+import type { TvResult } from '@server/models/Search';
+import { useRouter } from 'next/router';
+import { useState } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+
+const messages = defineMessages({
+ discovertv: 'Series',
+ activefilters:
+ '{count, plural, one {# Active Filter} other {# Active Filters}}',
+ sortPopularityAsc: 'Popularity Ascending',
+ sortPopularityDesc: 'Popularity Descending',
+ sortFirstAirDateAsc: 'First Air Date Ascending',
+ sortFirstAirDateDesc: 'First Air Date Descending',
+ sortTmdbRatingAsc: 'TMDB Rating Ascending',
+ sortTmdbRatingDesc: 'TMDB Rating Descending',
+ sortTitleAsc: 'Title (A-Z) Ascending',
+ sortTitleDesc: 'Title (Z-A) Descending',
+});
+
+const SortOptions: Record
+
+ {isEditing ? (
+
+
+ {getSliderTitle(slider)}
+
+ {(slider.type === DiscoverSliderType.TMDB_MOVIE_KEYWORD ||
+ slider.type === DiscoverSliderType.TMDB_TV_KEYWORD) && (
+
+
+ {slider.data?.split(',').map((keywordId) => (
+
+ )}
+ {(slider.type === DiscoverSliderType.TMDB_NETWORK ||
+ slider.type === DiscoverSliderType.TMDB_STUDIO) && (
+
+ {!slider.isBuiltIn && (
+ <>
+ {!isEditing ? (
+
+ ) : (
+
+ )}
+
+
+ )}
+
+
+
+
+
+
+
+
+
+
+
+ ) : (
+
+ {children}
+
+ )}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {type === 'movie' && (
+ <>
+
+ {intl.formatMessage(messages.studio)}
+
+
+ {intl.formatMessage(
+ type === 'movie' ? messages.releaseDate : messages.firstAirDate
+ )}
+
+
+
+
+
+ {intl.formatMessage(messages.from)}
+
+
+ {intl.formatMessage(messages.to)}
+
+
+
+ {intl.formatMessage(messages.tmdbuserscore)}
+
+
+
+
+ {intl.formatMessage(messages.streamingservices)}
+
+
+
+
+
+
+
+ {intl.formatMessage(messages.recentlyAdded)}
+
+
-
- {intl.formatMessage(messages.recentlyAdded)}
+ {hasPermission(Permission.ADMIN) && (
+ <>
+ {isEditing && (
+
diff --git a/src/components/RequestList/RequestItem/index.tsx b/src/components/RequestList/RequestItem/index.tsx
index bab252aa9..fffb68de2 100644
--- a/src/components/RequestList/RequestItem/index.tsx
+++ b/src/components/RequestList/RequestItem/index.tsx
@@ -8,12 +8,12 @@ import useDeepLinks from '@app/hooks/useDeepLinks';
import { Permission, useUser } from '@app/hooks/useUser';
import globalMessages from '@app/i18n/globalMessages';
import {
+ ArrowPathIcon,
CheckIcon,
PencilIcon,
- RefreshIcon,
TrashIcon,
- XIcon,
-} from '@heroicons/react/solid';
+ XMarkIcon,
+} from '@heroicons/react/24/solid';
import { MediaRequestStatus } from '@server/constants/media';
import type { MediaRequest } from '@server/entity/MediaRequest';
import type { MovieDetails } from '@server/models/Movie';
@@ -601,7 +601,7 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
disabled={isRetrying}
onClick={() => retryRequest()}
>
-
+
-
+
+
+
{sliderComponent}
+ );
+ })}
);
};
diff --git a/src/components/GenreTag/index.tsx b/src/components/GenreTag/index.tsx
new file mode 100644
index 000000000..bbb25afe0
--- /dev/null
+++ b/src/components/GenreTag/index.tsx
@@ -0,0 +1,28 @@
+import Spinner from '@app/assets/spinner.svg';
+import Tag from '@app/components/Common/Tag';
+import { RectangleStackIcon } from '@heroicons/react/24/outline';
+import type { TmdbGenre } from '@server/api/themoviedb/interfaces';
+import useSWR from 'swr';
+
+type GenreTagProps = {
+ type: 'tv' | 'movie';
+ genreId: number;
+};
+
+const GenreTag = ({ genreId, type }: GenreTagProps) => {
+ const { data, error } = useSWR
@@ -540,7 +540,7 @@ const RequestCard = ({ request, onTitleData }: RequestCardProps) => {
className="hidden sm:block"
onClick={() => deleteRequest()}
>
-
);
};
diff --git a/src/components/IssueList/IssueItem/index.tsx b/src/components/IssueList/IssueItem/index.tsx
index 00e486316..8a20b46a3 100644
--- a/src/components/IssueList/IssueItem/index.tsx
+++ b/src/components/IssueList/IssueItem/index.tsx
@@ -4,7 +4,7 @@ import CachedImage from '@app/components/Common/CachedImage';
import { issueOptions } from '@app/components/IssueModal/constants';
import { Permission, useUser } from '@app/hooks/useUser';
import globalMessages from '@app/i18n/globalMessages';
-import { EyeIcon } from '@heroicons/react/solid';
+import { EyeIcon } from '@heroicons/react/24/solid';
import { IssueStatus } from '@server/constants/issue';
import { MediaType } from '@server/constants/media';
import type Issue from '@server/entity/Issue';
diff --git a/src/components/IssueList/index.tsx b/src/components/IssueList/index.tsx
index 0c2ee3a9c..fe68ed660 100644
--- a/src/components/IssueList/index.tsx
+++ b/src/components/IssueList/index.tsx
@@ -6,11 +6,11 @@ import IssueItem from '@app/components/IssueList/IssueItem';
import { useUpdateQueryParams } from '@app/hooks/useUpdateQueryParams';
import globalMessages from '@app/i18n/globalMessages';
import {
+ BarsArrowDownIcon,
ChevronLeftIcon,
ChevronRightIcon,
- FilterIcon,
- SortDescendingIcon,
-} from '@heroicons/react/solid';
+ FunnelIcon,
+} from '@heroicons/react/24/solid';
import type { IssueResultsResponse } from '@server/interfaces/api/issueInterfaces';
import { useRouter } from 'next/router';
import { useEffect, useState } from 'react';
@@ -98,7 +98,7 @@ const IssueList = () => {
-
+
diff --git a/src/components/IssueDetails/index.tsx b/src/components/IssueDetails/index.tsx
index 4575320de..21c051be1 100644
--- a/src/components/IssueDetails/index.tsx
+++ b/src/components/IssueDetails/index.tsx
@@ -14,12 +14,12 @@ import globalMessages from '@app/i18n/globalMessages';
import Error from '@app/pages/_error';
import { Transition } from '@headlessui/react';
import {
- ChatIcon,
+ ChatBubbleOvalLeftEllipsisIcon,
CheckCircleIcon,
PlayIcon,
ServerIcon,
-} from '@heroicons/react/outline';
-import { RefreshIcon } from '@heroicons/react/solid';
+} from '@heroicons/react/24/outline';
+import { ArrowPathIcon } from '@heroicons/react/24/solid';
import { IssueStatus } from '@server/constants/issue';
import { MediaType } from '@server/constants/media';
import { MediaServerType } from '@server/constants/server';
@@ -390,26 +390,27 @@ const IssueDetails = () => {
)}
- {issueData?.media.serviceUrl && hasPermission(Permission.ADMIN) && (
-
- )}
+ {issueData?.media.serviceUrl &&
+ hasPermission(Permission.ADMIN) && (
+
+ )}
{issueData?.media.mediaUrl4k && (
-
-
+
+ );
+};
+
+export default MobileMenu;
diff --git a/src/components/Layout/Notifications/index.tsx b/src/components/Layout/Notifications/index.tsx
index eed2697eb..5a86ef437 100644
--- a/src/components/Layout/Notifications/index.tsx
+++ b/src/components/Layout/Notifications/index.tsx
@@ -1,4 +1,4 @@
-import { BellIcon } from '@heroicons/react/outline';
+import { BellIcon } from '@heroicons/react/24/outline';
const Notifications = () => {
return (
diff --git a/src/components/Layout/SearchInput/index.tsx b/src/components/Layout/SearchInput/index.tsx
index 3c971e37e..5c2dc1679 100644
--- a/src/components/Layout/SearchInput/index.tsx
+++ b/src/components/Layout/SearchInput/index.tsx
@@ -1,6 +1,6 @@
import useSearchInput from '@app/hooks/useSearchInput';
-import { XCircleIcon } from '@heroicons/react/outline';
-import { SearchIcon } from '@heroicons/react/solid';
+import { XCircleIcon } from '@heroicons/react/24/outline';
+import { MagnifyingGlassIcon } from '@heroicons/react/24/solid';
import { defineMessages, useIntl } from 'react-intl';
const messages = defineMessages({
@@ -18,7 +18,7 @@ const SearchInput = () => {
+
+
+ {filteredLinks.slice(0, 4).map((link) => {
+ const isActive =
+ router.pathname.match(link.activeRegExp) && !isOpen;
+ return (
+
+
+ {cloneElement(
+ isActive ? link.svgIconSelected : link.svgIcon,
+ {
+ className: 'h-6 w-6',
+ }
+ )}
+
+
+ );
+ })}
+ {filteredLinks.length > 4 && (
+
+ )}
+
+
-
,
- activeRegExp: /^\/(discover\/?(movies|tv)?)?$/,
+ activeRegExp: /^\/(discover\/?)?$/,
+ },
+ {
+ href: '/discover/movies',
+ messagesKey: 'browsemovies',
+ svgIcon: {
>
{sidebarLink.svgIcon}
{intl.formatMessage(
- messages[sidebarLink.messagesKey]
+ menuMessages[sidebarLink.messagesKey]
)}
@@ -242,7 +258,9 @@ const Sidebar = ({ open, setClosed }: SidebarProps) => {
data-testid={sidebarLink.dataTestId}
>
{sidebarLink.svgIcon}
- {intl.formatMessage(messages[sidebarLink.messagesKey])}
+ {intl.formatMessage(
+ menuMessages[sidebarLink.messagesKey]
+ )}
);
diff --git a/src/components/Layout/UserDropdown/index.tsx b/src/components/Layout/UserDropdown/index.tsx
index 57481b719..c21a9c506 100644
--- a/src/components/Layout/UserDropdown/index.tsx
+++ b/src/components/Layout/UserDropdown/index.tsx
@@ -1,8 +1,11 @@
import MiniQuotaDisplay from '@app/components/Layout/UserDropdown/MiniQuotaDisplay';
import { useUser } from '@app/hooks/useUser';
import { Menu, Transition } from '@headlessui/react';
-import { ClockIcon, LogoutIcon } from '@heroicons/react/outline';
-import { CogIcon, UserIcon } from '@heroicons/react/solid';
+import {
+ ArrowRightOnRectangleIcon,
+ ClockIcon,
+} from '@heroicons/react/24/outline';
+import { CogIcon, UserIcon } from '@heroicons/react/24/solid';
import axios from 'axios';
import type { LinkProps } from 'next/link';
import Link from 'next/link';
@@ -147,7 +150,7 @@ const UserDropdown = () => {
}`}
onClick={() => logout()}
>
-
- {data.updateAvailable &&
+
),
instructionsPullToRefresh: ReactDOMServer.renderToString(),
diff --git a/src/components/RegionSelector/index.tsx b/src/components/RegionSelector/index.tsx
index 5a714c742..d0a0113eb 100644
--- a/src/components/RegionSelector/index.tsx
+++ b/src/components/RegionSelector/index.tsx
@@ -1,6 +1,6 @@
import useSettings from '@app/hooks/useSettings';
import { Listbox, Transition } from '@headlessui/react';
-import { CheckIcon, ChevronDownIcon } from '@heroicons/react/solid';
+import { CheckIcon, ChevronDownIcon } from '@heroicons/react/24/solid';
import type { Region } from '@server/lib/settings';
import { hasFlag } from 'country-flag-icons';
import 'country-flag-icons/3x2/flags.css';
@@ -18,6 +18,8 @@ interface RegionSelectorProps {
value: string;
name: string;
isUserSetting?: boolean;
+ disableAll?: boolean;
+ watchProviders?: boolean;
onChange?: (fieldName: string, region: string) => void;
}
@@ -25,11 +27,15 @@ const RegionSelector = ({
name,
value,
isUserSetting = false,
+ disableAll = false,
+ watchProviders = false,
onChange,
}: RegionSelectorProps) => {
const { currentSettings } = useSettings();
const intl = useIntl();
- const { data: regions } = useSWR
+
);
};
diff --git a/src/components/PersonCard/index.tsx b/src/components/PersonCard/index.tsx
index c2b7b6422..3ca8c1798 100644
--- a/src/components/PersonCard/index.tsx
+++ b/src/components/PersonCard/index.tsx
@@ -1,5 +1,5 @@
import CachedImage from '@app/components/Common/CachedImage';
-import { UserCircleIcon } from '@heroicons/react/solid';
+import { UserCircleIcon } from '@heroicons/react/24/solid';
import Link from 'next/link';
import { useState } from 'react';
diff --git a/src/components/PlexLoginButton/index.tsx b/src/components/PlexLoginButton/index.tsx
index c89f10213..363231733 100644
--- a/src/components/PlexLoginButton/index.tsx
+++ b/src/components/PlexLoginButton/index.tsx
@@ -1,6 +1,6 @@
import globalMessages from '@app/i18n/globalMessages';
import PlexOAuth from '@app/utils/plex';
-import { LoginIcon } from '@heroicons/react/outline';
+import { ArrowLeftOnRectangleIcon } from '@heroicons/react/24/outline';
import { useState } from 'react';
import { defineMessages, useIntl } from 'react-intl';
@@ -49,7 +49,7 @@ const PlexLoginButton = ({
disabled={loading || isProcessing}
className="plex-button"
>
-
+
-
{intl.formatMessage(messages.seemore)}
diff --git a/src/components/MediaSlider/index.tsx b/src/components/MediaSlider/index.tsx
index 9a9bc054c..54b5cc801 100644
--- a/src/components/MediaSlider/index.tsx
+++ b/src/components/MediaSlider/index.tsx
@@ -3,7 +3,7 @@ import PersonCard from '@app/components/PersonCard';
import Slider from '@app/components/Slider';
import TitleCard from '@app/components/TitleCard';
import useSettings from '@app/hooks/useSettings';
-import { ArrowCircleRightIcon } from '@heroicons/react/outline';
+import { ArrowRightCircleIcon } from '@heroicons/react/24/outline';
import { MediaStatus } from '@server/constants/media';
import type {
MovieResult,
@@ -27,14 +27,18 @@ interface MediaSliderProps {
linkUrl?: string;
sliderKey: string;
hideWhenEmpty?: boolean;
+ extraParams?: string;
+ onNewTitles?: (titleCount: number) => void;
}
const MediaSlider = ({
title,
url,
linkUrl,
+ extraParams,
sliderKey,
hideWhenEmpty = false,
+ onNewTitles,
}: MediaSliderProps) => {
const settings = useSettings();
const { data, error, setSize, size } = useSWRInfinite
{linkUrl ? (
-
- {title}
-
)}
+ {data.keywords.length > 0 && (
+
+ {data.keywords.map((keyword) => (
+
+
+
+ )}
{data.collection && (
@@ -817,7 +832,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
{intl.formatMessage(messages.cast)}
-
@@ -851,7 +866,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
linkUrl={`/movie/${data.id}/similar`}
hideWhenEmpty
/>
-
+
-
),
iconRefreshing: ReactDOMServer.renderToString(
@@ -23,7 +23,7 @@ const PullToRefresh = () => {
className="animate-spin p-2"
style={{ animationDirection: 'reverse' }}
>
-
-
+ {({ selected, active }) => (
+
+ )}
+
- {intl.formatMessage(messages.regionDefault)}
-
- {selected && (
-
- )}
-
+ {selected && (
+
+
-
-
