Delete dependabot.yml

Converting this to use prisma with postgres instead of using typeorm and sqlite

BREAKING CHANGE: Incomplete index page in server folder

.env

@@ -0,0 +1,7 @@
+# Environment variables declared in this file are automatically made available to Prisma.
+# See the documentation for more detail: https://pris.ly/d/prisma-schema#accessing-environment-variables-from-the-schema
+
+# Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB (Preview) and CockroachDB (Preview).
+# See the documentation for all the connection string options: https://pris.ly/d/connection-strings
+
+DATABASE_URL="postgresql://jumail:1DontGive1@localhost:5432/jellyseerr?schema=public"

.github/dependabot.yml

@@ -1,14 +0,0 @@
-version: 2
-updates:
-  - package-ecosystem: npm
-    directory: '/'
-    schedule:
-      interval: daily
-      time: '20:00'
-    open-pull-requests-limit: 10
-  - package-ecosystem: github-actions
-    directory: '/'
-    schedule:
-      interval: daily
-      time: '20:00'
-    open-pull-requests-limit: 10

.vscode/settings.json

@@ -15,6 +15,7 @@
       "database": "./config/db/db.sqlite3"
     }
   ],
+  "i18n-ally.localesPaths": ["src/i18n", "src/i18n/locale"],
   "editor.codeActionsOnSave": {
     "source.organizeImports": true
   },

README.md

@@ -2,157 +2,48 @@
 <img src="./public/logo_full.svg" alt="Overseerr" style="margin: 20px 0;">
 </p>
 <p align="center">
-<img src="https://github.com/sct/overseerr/workflows/Overseerr%20Release/badge.svg?branch=master" alt="Overseerr Release" />
-<img src="https://github.com/sct/overseerr/workflows/Overseerr%20CI/badge.svg" alt="Overseerr CI">
-</p>
-<p align="center">
-<a href="https://discord.gg/overseerr"><img src="https://img.shields.io/discord/783137440809746482" alt="Discord"></a>
-<a href="https://hub.docker.com/r/sctx/overseerr"><img src="https://img.shields.io/docker/pulls/sctx/overseerr" alt="Docker pulls"></a>
-<a href="https://hosted.weblate.org/engage/overseerr/"><img src="https://hosted.weblate.org/widgets/overseerr/-/overseerr-frontend/svg-badge.svg" alt="Translation status" /></a>
-<a href="https://lgtm.com/projects/g/sct/overseerr/context:javascript"><img alt="Language grade: JavaScript" src="https://img.shields.io/lgtm/grade/javascript/g/sct/overseerr.svg?logo=lgtm&logoWidth=18"/></a>
-<a href="https://github.com/sct/overseerr/blob/develop/LICENSE"><img alt="GitHub" src="https://img.shields.io/github/license/sct/overseerr"></a>
-<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
-<a href="#contributors-"><img alt="All Contributors" src="https://img.shields.io/badge/all_contributors-58-orange.svg"/></a>
-<!-- ALL-CONTRIBUTORS-BADGE:END -->
+<a href="https://discord.gg/BHak4GCk"><img src="https://img.shields.io/badge/Discord-Chat-lightgrey" alt="Discord"></a>
 </p>
 
-**Overseerr** is a free and open source software application for managing requests for your media library. It integrates with your existing services, such as **[Sonarr](https://sonarr.tv/)**, **[Radarr](https://radarr.video/)**, and **[Plex](https://www.plex.tv/)**!
+**Jellyseerr** is a free and open source fork of Overseerr for managing requests for your media library. It integrates with your existing services, such as **[Sonarr](https://sonarr.tv/)**, **[Radarr](https://radarr.video/)**, and **[Jellyfin](https://jellyfin.org/)**!
 
 ## Current Features
 
-- Full Plex integration. Authenticate and manage user access with Plex!
-- Easy integration with your existing services. Currently, Overseerr supports Sonarr and Radarr. More to come!
-- Plex library scan, to keep track of the titles which are already available.
+- Jellyfin support
+- Easy integration with your existing services. Currently, Jellyseerr supports Sonarr and Radarr.
+- Jellyfin library scan, to keep track of the titles which are already available.
 - Customizable request system, which allows users to request individual seasons or movies in a friendly, easy-to-use interface.
 - Incredibly simple request management UI. Don't dig through the app to simply approve recent requests!
 - Granular permission system.
 - Support for various notification agents.
 - Mobile-friendly design, for when you need to approve requests on the go!
 
-With more features on the way! Check out our [issue tracker](https://github.com/sct/overseerr/issues) to see the features which have already been requested.
+Check out our [issue tracker](https://github.com/Fallenbagel/jellyseerr/issues).
+
+## Supported Architectures
+
+Jellyseerr image support multiple architectures such as x86-64, arm64 and armv7. 
+
+| **Architecture** | **Tag** |
+|------------------|---------|
+|      x86-64      |  latest |
+|       ARM64      |   arm   |
+|       ARMv7      |   arm   |
 
 ## Getting Started
 
-Check out our documentation for instructions on how to install and run Overseerr:
-
-https://docs.overseerr.dev/getting-started/installation
-
-## Preview
-
-<img src="./public/preview.jpg">
+Check out our dockerhub for instructions on how to install and run Jellyseerr:
+https://hub.docker.com/r/fallenbagel/jellyseerr
 
 ## Support
 
-- Check out the [Overseerr Documentation](https://docs.overseerr.dev/) before asking for help. Your question might already be in the [FAQ](https://docs.overseerr.dev/support/faq).
-- You can get support on [Discord](https://discord.gg/overseerr).
-- You can ask questions in the Help category of our [GitHub Discussions](https://github.com/sct/overseerr/discussions).
+- You can get support on [Discord](https://discord.gg/VpVnZ92yQK).
 - Bug reports and feature requests can be submitted via [GitHub Issues](https://github.com/sct/overseerr/issues).
 
-## API Documentation
-
-Our documentation is built on every commit and hosted at https://api-docs.overseerr.dev
-
-You can also access the API documentation from your local Overseerr install at http://localhost:5055/api-docs
-
-## Community
-
-You can ask questions, share ideas, and more in [GitHub Discussions](https://github.com/sct/overseerr/discussions).
-
-If you would like to chat with other members of our growing community, [join the Overseerr Discord server](https://discord.gg/overseerr)!
-
-Our [Code of Conduct](https://github.com/sct/overseerr/blob/develop/CODE_OF_CONDUCT.md) applies to all Overseerr community channels.
-
-## Contributing
-
-You can help improve Overseerr too! Check out our [Contribution Guide](https://github.com/sct/overseerr/blob/develop/CONTRIBUTING.md) to get started.
-
-## Contributors ✨
-
-Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
-
-<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
-<!-- prettier-ignore-start -->
-<!-- markdownlint-disable -->
-<table>
-  <tr>
-    <td align="center"><a href="https://sct.dev"><img src="https://avatars1.githubusercontent.com/u/234213?v=4?s=100" width="100px;" alt=""/><br /><sub><b>sct</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=sct" title="Code">💻</a> <a href="#design-sct" title="Design">🎨</a> <a href="#ideas-sct" title="Ideas, Planning, & Feedback">🤔</a></td>
-    <td align="center"><a href="https://github.com/azoitos"><img src="https://avatars2.githubusercontent.com/u/26529049?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Alex Zoitos</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=azoitos" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/OwsleyJr"><img src="https://avatars3.githubusercontent.com/u/8635678?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Brandon Cohen</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=OwsleyJr" title="Code">💻</a> <a href="https://github.com/sct/overseerr/commits?author=OwsleyJr" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/Ahreluth"><img src="https://avatars2.githubusercontent.com/u/75682440?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Ahreluth</b></sub></a><br /><a href="#translation-Ahreluth" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/KovalevArtem"><img src="https://avatars0.githubusercontent.com/u/36500228?v=4?s=100" width="100px;" alt=""/><br /><sub><b>KovalevArtem</b></sub></a><br /><a href="#translation-KovalevArtem" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/GiyomuWeb"><img src="https://avatars0.githubusercontent.com/u/62489209?v=4?s=100" width="100px;" alt=""/><br /><sub><b>GiyomuWeb</b></sub></a><br /><a href="#translation-GiyomuWeb" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/angrycuban13"><img src="https://avatars3.githubusercontent.com/u/39564898?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Angry Cuban</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=angrycuban13" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/jvennik"><img src="https://avatars3.githubusercontent.com/u/6672637?v=4?s=100" width="100px;" alt=""/><br /><sub><b>jvennik</b></sub></a><br /><a href="#translation-jvennik" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/darknessgp"><img src="https://avatars0.githubusercontent.com/u/1521243?v=4?s=100" width="100px;" alt=""/><br /><sub><b>darknessgp</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=darknessgp" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/saltydk"><img src="https://avatars1.githubusercontent.com/u/6587950?v=4?s=100" width="100px;" alt=""/><br /><sub><b>salty</b></sub></a><br /><a href="#infra-saltydk" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a></td>
-    <td align="center"><a href="https://github.com/Shutruk"><img src="https://avatars2.githubusercontent.com/u/9198633?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Shutruk</b></sub></a><br /><a href="#translation-Shutruk" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/krystiancharubin"><img src="https://avatars2.githubusercontent.com/u/17775600?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Krystian Charubin</b></sub></a><br /><a href="#design-krystiancharubin" title="Design">🎨</a></td>
-    <td align="center"><a href="https://github.com/kieron"><img src="https://avatars2.githubusercontent.com/u/8655212?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Kieron Boswell</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=kieron" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/samwiseg0"><img src="https://avatars1.githubusercontent.com/u/2241731?v=4?s=100" width="100px;" alt=""/><br /><sub><b>samwiseg0</b></sub></a><br /><a href="#question-samwiseg0" title="Answering Questions">💬</a> <a href="#infra-samwiseg0" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/ecelebi29"><img src="https://avatars2.githubusercontent.com/u/8337120?v=4?s=100" width="100px;" alt=""/><br /><sub><b>ecelebi29</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=ecelebi29" title="Code">💻</a> <a href="https://github.com/sct/overseerr/commits?author=ecelebi29" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/mmozeiko"><img src="https://avatars3.githubusercontent.com/u/1665010?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Mārtiņš Možeiko</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=mmozeiko" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/mazzetta86"><img src="https://avatars2.githubusercontent.com/u/45591560?v=4?s=100" width="100px;" alt=""/><br /><sub><b>mazzetta86</b></sub></a><br /><a href="#translation-mazzetta86" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/Panzer1119"><img src="https://avatars1.githubusercontent.com/u/23016343?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Paul Hagedorn</b></sub></a><br /><a href="#translation-Panzer1119" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/Shagon94"><img src="https://avatars3.githubusercontent.com/u/9140783?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Shagon94</b></sub></a><br /><a href="#translation-Shagon94" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/sebstrgg"><img src="https://avatars3.githubusercontent.com/u/27026694?v=4?s=100" width="100px;" alt=""/><br /><sub><b>sebstrgg</b></sub></a><br /><a href="#translation-sebstrgg" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/danshilm"><img src="https://avatars2.githubusercontent.com/u/20923978?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Danshil Mungur</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=danshilm" title="Code">💻</a> <a href="https://github.com/sct/overseerr/commits?author=danshilm" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/doob187"><img src="https://avatars1.githubusercontent.com/u/60312740?v=4?s=100" width="100px;" alt=""/><br /><sub><b>doob187</b></sub></a><br /><a href="#infra-doob187" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a></td>
-    <td align="center"><a href="https://github.com/johnpyp"><img src="https://avatars2.githubusercontent.com/u/20625636?v=4?s=100" width="100px;" alt=""/><br /><sub><b>johnpyp</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=johnpyp" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/ankarhem"><img src="https://avatars1.githubusercontent.com/u/14110063?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Jakob Ankarhem</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=ankarhem" title="Documentation">📖</a> <a href="https://github.com/sct/overseerr/commits?author=ankarhem" title="Code">💻</a> <a href="#translation-ankarhem" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/jayesh100"><img src="https://avatars1.githubusercontent.com/u/8022175?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Jayesh</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=jayesh100" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/flying-sausages"><img src="https://avatars1.githubusercontent.com/u/23618693?v=4?s=100" width="100px;" alt=""/><br /><sub><b>flying-sausages</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=flying-sausages" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/hirenshah"><img src="https://avatars2.githubusercontent.com/u/418112?v=4?s=100" width="100px;" alt=""/><br /><sub><b>hirenshah</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=hirenshah" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/TheCatLady"><img src="https://avatars0.githubusercontent.com/u/52870424?v=4?s=100" width="100px;" alt=""/><br /><sub><b>TheCatLady</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=TheCatLady" title="Code">💻</a> <a href="#translation-TheCatLady" title="Translation">🌍</a> <a href="https://github.com/sct/overseerr/commits?author=TheCatLady" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/chriscpritchard"><img src="https://avatars1.githubusercontent.com/u/1839074?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Chris Pritchard</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=chriscpritchard" title="Code">💻</a> <a href="https://github.com/sct/overseerr/commits?author=chriscpritchard" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/Tamberlox"><img src="https://avatars3.githubusercontent.com/u/56069014?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Tamberlox</b></sub></a><br /><a href="#translation-Tamberlox" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://hmnd.io"><img src="https://avatars.githubusercontent.com/u/12853597?v=4?s=100" width="100px;" alt=""/><br /><sub><b>David</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=hmnd" title="Code">💻</a></td>
-    <td align="center"><a href="https://www.douglas-parker.com"><img src="https://avatars.githubusercontent.com/u/18235822?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Douglas Parker</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=douglasparker" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/dancarter"><img src="https://avatars.githubusercontent.com/u/4387516?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Daniel Carter</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=dancarter" title="Code">💻</a></td>
-    <td align="center"><a href="https://nuro.dev"><img src="https://avatars.githubusercontent.com/u/4991309?v=4?s=100" width="100px;" alt=""/><br /><sub><b>nuro</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=NuroDev" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/onedr0p"><img src="https://avatars.githubusercontent.com/u/213795?v=4?s=100" width="100px;" alt=""/><br /><sub><b>ᗪєνιη ᗷυнʟ</b></sub></a><br /><a href="#infra-onedr0p" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/JonnyWong16"><img src="https://avatars.githubusercontent.com/u/9099342?v=4?s=100" width="100px;" alt=""/><br /><sub><b>JonnyWong16</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=JonnyWong16" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/Roxedus"><img src="https://avatars.githubusercontent.com/u/7110194?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Roxedus</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=Roxedus" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/WoisWoi"><img src="https://avatars.githubusercontent.com/u/75491231?v=4?s=100" width="100px;" alt=""/><br /><sub><b>WoisWoi</b></sub></a><br /><a href="#translation-WoisWoi" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/HubDuck"><img src="https://avatars.githubusercontent.com/u/77843475?v=4?s=100" width="100px;" alt=""/><br /><sub><b>HubDuck</b></sub></a><br /><a href="#translation-HubDuck" title="Translation">🌍</a> <a href="https://github.com/sct/overseerr/commits?author=HubDuck" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/costaht"><img src="https://avatars.githubusercontent.com/u/50637431?v=4?s=100" width="100px;" alt=""/><br /><sub><b>costaht</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=costaht" title="Documentation">📖</a> <a href="#translation-costaht" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/Shjosan"><img src="https://avatars.githubusercontent.com/u/20847626?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Shjosan</b></sub></a><br /><a href="#translation-Shjosan" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/kobaubarr"><img src="https://avatars.githubusercontent.com/u/28481522?v=4?s=100" width="100px;" alt=""/><br /><sub><b>kobaubarr</b></sub></a><br /><a href="#translation-kobaubarr" title="Translation">🌍</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/notorius28"><img src="https://avatars.githubusercontent.com/u/1621513?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Ricardo González</b></sub></a><br /><a href="#translation-notorius28" title="Translation">🌍</a></td>
-    <td align="center"><a href="http://torkili.uz"><img src="https://avatars.githubusercontent.com/u/460764?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Torkil</b></sub></a><br /><a href="#translation-Torkiliuz" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://www.jagandeepbrar.io"><img src="https://avatars.githubusercontent.com/u/3048295?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Jagandeep Brar</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=JagandeepBrar" title="Documentation">📖</a></td>
-    <td align="center"><a href="http://dtalens.com"><img src="https://avatars.githubusercontent.com/u/6631832?v=4?s=100" width="100px;" alt=""/><br /><sub><b>dtalens</b></sub></a><br /><a href="#translation-dtalens" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/acortelyou"><img src="https://avatars.githubusercontent.com/u/1689668?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Alex Cortelyou</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=acortelyou" title="Code">💻</a></td>
-    <td align="center"><a href="https://nz.linkedin.com/in/jonocairns"><img src="https://avatars.githubusercontent.com/u/182836?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Jono Cairns</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=jonocairns" title="Code">💻</a></td>
-    <td align="center"><a href="https://scias.net/"><img src="https://avatars.githubusercontent.com/u/439655?v=4?s=100" width="100px;" alt=""/><br /><sub><b>DJScias</b></sub></a><br /><a href="#translation-DJScias" title="Translation">🌍</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/Dabu-dot"><img src="https://avatars.githubusercontent.com/u/52525576?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Dabu-dot</b></sub></a><br /><a href="#translation-Dabu-dot" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/Jabster28"><img src="https://avatars.githubusercontent.com/u/29015942?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Jabster28</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=Jabster28" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/littlerooster"><img src="https://avatars.githubusercontent.com/u/83890654?v=4?s=100" width="100px;" alt=""/><br /><sub><b>littlerooster</b></sub></a><br /><a href="#translation-littlerooster" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/dphildebrandt"><img src="https://avatars.githubusercontent.com/u/154459?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Dustin Hildebrandt</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=dphildebrandt" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/Generator"><img src="https://avatars.githubusercontent.com/u/44146?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Bruno Guerreiro</b></sub></a><br /><a href="#translation-Generator" title="Translation">🌍</a></td>
-    <td align="center"><a href="https://github.com/iceHtwoO"><img src="https://avatars.githubusercontent.com/u/27020492?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Alexander Neuhäuser</b></sub></a><br /><a href="#translation-iceHtwoO" title="Translation">🌍</a></td>
-    <td align="center"><a href="http://www.unext.co.jp"><img src="https://avatars.githubusercontent.com/u/37431541?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Livio</b></sub></a><br /><a href="#design-liviokanone" title="Design">🎨</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/tangentThought"><img src="https://avatars.githubusercontent.com/u/25516090?v=4?s=100" width="100px;" alt=""/><br /><sub><b>tangentThought</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=tangentThought" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/nicospz"><img src="https://avatars.githubusercontent.com/u/31373060?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Nicolás Espinoza</b></sub></a><br /><a href="https://github.com/sct/overseerr/commits?author=nicospz" title="Code">💻</a></td>
-  </tr>
-</table>
-
 <!-- markdownlint-restore -->
 <!-- prettier-ignore-end -->
 
-<!-- ALL-CONTRIBUTORS-LIST:END -->
+## Buy me a Coffee!
+If you like jellyseerr and want to help maintain it, please buy me a coffee as it would help me out a lot!
+
+[!["Buy Me A Coffee"](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://www.buymeacoffee.com/fallen.bagel)

overseerr-api.yml

@@ -55,10 +55,13 @@ components:
           readOnly: true
         username:
           type: string
+        plexUsername:
+          type: string
+          readOnly: true
         plexToken:
           type: string
           readOnly: true
-        plexUsername:
+        jellyfinAuthToken:
           type: string
           readOnly: true
         userType:
@@ -127,6 +130,9 @@ components:
         localLogin:
           type: boolean
           example: true
+        mediaServerType:
+          type: number
+          example: 1
         newPlexLogin:
           type: boolean
           example: true
@@ -298,6 +304,47 @@ components:
         - provides
         - owned
         - connection
+    JellyfinLibrary:
+      type: object
+      properties:
+        id:
+          type: string
+        name:
+          type: string
+          example: Movies
+        enabled:
+          type: boolean
+          example: false
+      required:
+        - id
+        - name
+        - enabled
+    JellyfinSettings:
+      type: object
+      properties:
+        name:
+          type: string
+          example: 'Main Server'
+          readOnly: true
+        hostname:
+          type: string
+          example: 'http://my.jellyfin.host'
+        adminUser:
+          type: string
+          example: 'admin'
+        adminPass:
+          type: string
+          example: 'mypassword'
+        libraries:
+          type: array
+          readOnly: true
+          items:
+            $ref: '#/components/schemas/JellyfinLibrary'
+        serverID:
+          type: string
+          readOnly: true
+      required:
+        - hostname
     RadarrSettings:
       type: object
       properties:
@@ -1762,6 +1809,136 @@ paths:
             application/json:
               schema:
                 $ref: '#/components/schemas/MainSettings'
+  /settings/jellyfin:
+    get:
+      summary: Get Jellyfin settings
+      description: Retrieves current Jellyfin settings.
+      tags:
+        - settings
+      responses:
+        '200':
+          description: OK
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/JellyfinSettings'
+    post:
+      summary: Update Jellyfin settings
+      description: Updates Jellyfin settings with the provided values.
+      tags:
+        - settings
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/JellyfinSettings'
+      responses:
+        '200':
+          description: 'Values were successfully updated'
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/JellyfinSettings'
+  /settings/jellyfin/library:
+    get:
+      summary: Get Jellyfin libraries
+      description: Returns a list of Jellyfin libraries in a JSON array.
+      tags:
+        - settings
+      parameters:
+        - in: query
+          name: sync
+          description: Syncs the current libraries with the current Jellyfin server
+          schema:
+            type: string
+            nullable: true
+        - in: query
+          name: enable
+          explode: false
+          allowReserved: true
+          description: Comma separated list of libraries to enable. Any libraries not passed will be disabled!
+          schema:
+            type: string
+            nullable: true
+      responses:
+        '200':
+          description: 'Jellyfin libraries returned'
+          content:
+            application/json:
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/JellyfinLibrary'
+  /settings/jellyfin/sync:
+    get:
+      summary: Get status of full Jellyfin library sync
+      description: Returns sync progress in a JSON array.
+      tags:
+        - settings
+      responses:
+        '200':
+          description: Status of Jellyfin sync
+          content:
+            application/json:
+              schema:
+                type: object
+                properties:
+                  running:
+                    type: boolean
+                    example: false
+                  progress:
+                    type: number
+                    example: 0
+                  total:
+                    type: number
+                    example: 100
+                  currentLibrary:
+                    $ref: '#/components/schemas/JellyfinLibrary'
+                  libraries:
+                    type: array
+                    items:
+                      $ref: '#/components/schemas/JellyfinLibrary'
+    post:
+      summary: Start full Jellyfin library sync
+      description: Runs a full Jellyfin library sync and returns the progress in a JSON array.
+      tags:
+        - settings
+      requestBody:
+        content:
+          application/json:
+            schema:
+              type: object
+              properties:
+                cancel:
+                  type: boolean
+                  example: false
+                start:
+                  type: boolean
+                  example: false
+      responses:
+        '200':
+          description: Status of Jellyfin sync
+          content:
+            application/json:
+              schema:
+                type: object
+                properties:
+                  running:
+                    type: boolean
+                    example: false
+                  progress:
+                    type: number
+                    example: 0
+                  total:
+                    type: number
+                    example: 100
+                  currentLibrary:
+                    $ref: '#/components/schemas/JellyfinLibrary'
+                  libraries:
+                    type: array
+                    items:
+                      $ref: '#/components/schemas/JellyfinLibrary'
   /settings/plex:
     get:
       summary: Get Plex settings
@@ -2879,6 +3056,38 @@ paths:
                   type: string
               required:
                 - authToken
+  /auth/jellyfin:
+    post:
+      summary: Sign in using a Jellyfin username and password
+      description: Takes the user's username and password to log the user in. Generates a session cookie for use in further requests. If the user does not exist, and there are no other users, then a user will be created with full admin privileges. If a user logs in with access to the Jellyfin server, they will also have an account created, but without any permissions.
+      security: []
+      tags:
+        - auth
+      responses:
+        '200':
+          description: OK
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/User'
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              type: object
+              properties:
+                username:
+                  type: string
+                password:
+                  type: string
+                hostname:
+                  type: string
+                email:
+                  type: string
+              required:
+                - username
+                - password
   /auth/local:
     post:
       summary: Sign in using a local account

package.json

@@ -19,6 +19,7 @@
   "dependencies": {
     "@headlessui/react": "^1.4.1",
     "@heroicons/react": "^1.0.4",
+    "@prisma/client": "^3.11.1",
     "@supercharge/request-ip": "^1.1.2",
     "@svgr/webpack": "^5.5.0",
     "@tanem/react-nprogress": "^3.0.79",
@@ -46,6 +47,7 @@
     "nodemailer": "^6.6.3",
     "openpgp": "^5.0.0-3",
     "plex-api": "^5.3.1",
+    "prisma": "^3.11.1",
     "pug": "^3.0.2",
     "react": "17.0.2",
     "react-ace": "^9.3.0",
@@ -66,6 +68,7 @@
     "swagger-ui-express": "^4.1.6",
     "swr": "^0.5.6",
     "typeorm": "0.2.37",
+    "uuid": "^8.3.2",
     "web-push": "^3.4.5",
     "winston": "^3.3.3",
     "winston-daily-rotate-file": "^4.5.5",
@@ -77,6 +80,7 @@
     "@babel/cli": "^7.15.7",
     "@commitlint/cli": "^13.1.0",
     "@commitlint/config-conventional": "^13.1.0",
+    "@fullhuman/postcss-purgecss": "3.0.0",
     "@semantic-release/changelog": "^5.0.1",
     "@semantic-release/commit-analyzer": "^9.0.1",
     "@semantic-release/exec": "^5.0.0",
@@ -103,6 +107,7 @@
     "@types/react-transition-group": "^4.4.3",
     "@types/secure-random-password": "^0.2.1",
     "@types/swagger-ui-express": "^4.1.3",
+    "@types/uuid": "^8.3.1",
     "@types/web-push": "^3.3.2",
     "@types/xml2js": "^0.4.9",
     "@types/yamljs": "^0.2.31",

prisma/migrations/20220326212051_init/migration.sql

@@ -0,0 +1,163 @@
+-- CreateTable
+CREATE TABLE "media" (
+    "id" SERIAL NOT NULL,
+    "mediaType" TEXT NOT NULL,
+    "tmdbId" INTEGER NOT NULL,
+    "tvdbId" INTEGER,
+    "imdbId" TEXT,
+    "status" INTEGER NOT NULL DEFAULT 1,
+    "status4k" INTEGER NOT NULL DEFAULT 1,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "lastSeasonChange" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "mediaAddedAt" TIMESTAMP(3),
+    "serviceId" INTEGER,
+    "serviceId4k" INTEGER,
+    "externalServiceId" INTEGER,
+    "externalServiceId4k" INTEGER,
+    "externalServiceSlug" TEXT,
+    "externalServiceSlug4k" TEXT,
+    "ratingKey" TEXT,
+    "ratingKey4k" TEXT,
+    "jellyfinMediaId" TEXT,
+    "jellyfinMediaId4k" TEXT,
+
+    CONSTRAINT "media_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "media_request" (
+    "id" SERIAL NOT NULL,
+    "status" INTEGER NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "type" TEXT NOT NULL,
+    "mediaId" INTEGER,
+    "requestedById" INTEGER,
+    "modifiedById" INTEGER,
+    "is4k" BOOLEAN NOT NULL DEFAULT false,
+    "serverId" INTEGER,
+    "profileId" INTEGER,
+    "rootFolder" TEXT,
+    "languageProfileId" INTEGER,
+
+    CONSTRAINT "media_request_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "migrations" (
+    "id" SERIAL NOT NULL,
+    "timestamp" BIGINT NOT NULL,
+    "name" TEXT NOT NULL,
+
+    CONSTRAINT "migrations_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "season" (
+    "id" SERIAL NOT NULL,
+    "seasonNumber" INTEGER NOT NULL,
+    "status" INTEGER NOT NULL DEFAULT 1,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "mediaId" INTEGER,
+    "status4k" INTEGER NOT NULL DEFAULT 1,
+
+    CONSTRAINT "season_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "season_request" (
+    "id" SERIAL NOT NULL,
+    "seasonNumber" INTEGER NOT NULL,
+    "status" INTEGER NOT NULL DEFAULT 1,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "requestId" INTEGER,
+
+    CONSTRAINT "season_request_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "session" (
+    "expiredAt" BIGINT NOT NULL,
+    "id" TEXT NOT NULL,
+    "json" TEXT NOT NULL,
+
+    CONSTRAINT "session_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "user" (
+    "id" SERIAL NOT NULL,
+    "email" TEXT NOT NULL,
+    "username" TEXT,
+    "plexId" INTEGER,
+    "plexToken" TEXT,
+    "permissions" INTEGER NOT NULL DEFAULT 0,
+    "avatar" TEXT NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "password" TEXT,
+    "userType" INTEGER NOT NULL DEFAULT 1,
+    "plexUsername" TEXT,
+    "resetPasswordGuid" TEXT,
+    "recoveryLinkExpirationDate" TIMESTAMP(3),
+    "jellyfinUsername" TEXT,
+    "jellyfinAuthToken" TEXT,
+    "jellyfinUserId" TEXT,
+    "jellyfinDeviceId" TEXT,
+
+    CONSTRAINT "user_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "user_settings" (
+    "id" SERIAL NOT NULL,
+    "enableNotifications" BOOLEAN NOT NULL DEFAULT true,
+    "discordId" TEXT,
+    "userId" INTEGER,
+    "region" TEXT,
+    "originalLanguage" TEXT,
+
+    CONSTRAINT "user_settings_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "sqlite_autoindex_media_1" ON "media"("tvdbId");
+
+-- CreateIndex
+CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media"("imdbId");
+
+-- CreateIndex
+CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media"("tvdbId");
+
+-- CreateIndex
+CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media"("tmdbId");
+
+-- CreateIndex
+CREATE INDEX "IDX_28c5d1d16da7908c97c9bc2f74" ON "session"("expiredAt");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "sqlite_autoindex_user_1" ON "user"("email");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "sqlite_autoindex_user_settings_1" ON "user_settings"("userId");
+
+-- AddForeignKey
+ALTER TABLE "media_request" ADD CONSTRAINT "media_request_mediaId_fkey" FOREIGN KEY ("mediaId") REFERENCES "media"("id") ON DELETE CASCADE ON UPDATE NO ACTION;
+
+-- AddForeignKey
+ALTER TABLE "media_request" ADD CONSTRAINT "media_request_modifiedById_fkey" FOREIGN KEY ("modifiedById") REFERENCES "user"("id") ON DELETE SET NULL ON UPDATE NO ACTION;
+
+-- AddForeignKey
+ALTER TABLE "media_request" ADD CONSTRAINT "media_request_requestedById_fkey" FOREIGN KEY ("requestedById") REFERENCES "user"("id") ON DELETE CASCADE ON UPDATE NO ACTION;
+
+-- AddForeignKey
+ALTER TABLE "season" ADD CONSTRAINT "season_mediaId_fkey" FOREIGN KEY ("mediaId") REFERENCES "media"("id") ON DELETE CASCADE ON UPDATE NO ACTION;
+
+-- AddForeignKey
+ALTER TABLE "season_request" ADD CONSTRAINT "season_request_requestId_fkey" FOREIGN KEY ("requestId") REFERENCES "media_request"("id") ON DELETE CASCADE ON UPDATE NO ACTION;
+
+-- AddForeignKey
+ALTER TABLE "user_settings" ADD CONSTRAINT "user_settings_userId_fkey" FOREIGN KEY ("userId") REFERENCES "user"("id") ON DELETE CASCADE ON UPDATE NO ACTION;

prisma/migrations/migration_lock.toml

@@ -0,0 +1,3 @@
+# Please do not edit this file manually
+# It should be added in your version-control system (i.e. Git)
+provider = "postgresql"

prisma/schema.prisma

@@ -0,0 +1,127 @@
+generator client {
+  provider = "prisma-client-js"
+}
+
+datasource db {
+  provider = "postgres"
+  url      = env("DATABASE_URL")
+}
+
+model media {
+  id                    Int             @id @default(autoincrement())
+  mediaType             String
+  tmdbId                Int
+  tvdbId                Int?            @unique(map: "sqlite_autoindex_media_1")
+  imdbId                String?
+  status                Int             @default(1)
+  status4k              Int             @default(1)
+  createdAt             DateTime        @default(now())
+  updatedAt             DateTime        @default(now())
+  lastSeasonChange      DateTime        @default(now())
+  mediaAddedAt          DateTime?
+  serviceId             Int?
+  serviceId4k           Int?
+  externalServiceId     Int?
+  externalServiceId4k   Int?
+  externalServiceSlug   String?
+  externalServiceSlug4k String?
+  ratingKey             String?
+  ratingKey4k           String?
+  jellyfinMediaId       String?
+  jellyfinMediaId4k     String?
+  media_request         media_request[]
+  season                season[]
+
+  @@index([imdbId], map: "IDX_7ff2d11f6a83cb52386eaebe74")
+  @@index([tvdbId], map: "IDX_41a289eb1fa489c1bc6f38d9c3")
+  @@index([tmdbId], map: "IDX_7157aad07c73f6a6ae3bbd5ef5")
+}
+
+model media_request {
+  id                                     Int              @id @default(autoincrement())
+  status                                 Int
+  createdAt                              DateTime         @default(now())
+  updatedAt                              DateTime         @default(now())
+  type                                   String
+  mediaId                                Int?
+  requestedById                          Int?
+  modifiedById                           Int?
+  is4k                                   Boolean          @default(false)
+  serverId                               Int?
+  profileId                              Int?
+  rootFolder                             String?
+  languageProfileId                      Int?
+  media                                  media?           @relation(fields: [mediaId], references: [id], onDelete: Cascade, onUpdate: NoAction)
+  user_media_request_modifiedByIdTouser  user?            @relation("media_request_modifiedByIdTouser", fields: [modifiedById], references: [id], onUpdate: NoAction)
+  user_media_request_requestedByIdTouser user?            @relation("media_request_requestedByIdTouser", fields: [requestedById], references: [id], onDelete: Cascade, onUpdate: NoAction)
+  season_request                         season_request[]
+}
+
+model migrations {
+  id        Int    @id @default(autoincrement())
+  timestamp BigInt
+  name      String
+}
+
+model season {
+  id           Int      @id @default(autoincrement())
+  seasonNumber Int
+  status       Int      @default(1)
+  createdAt    DateTime @default(now())
+  updatedAt    DateTime @default(now())
+  mediaId      Int?
+  status4k     Int      @default(1)
+  media        media?   @relation(fields: [mediaId], references: [id], onDelete: Cascade, onUpdate: NoAction)
+}
+
+model season_request {
+  id            Int            @id @default(autoincrement())
+  seasonNumber  Int
+  status        Int            @default(1)
+  createdAt     DateTime       @default(now())
+  updatedAt     DateTime       @default(now())
+  requestId     Int?
+  media_request media_request? @relation(fields: [requestId], references: [id], onDelete: Cascade, onUpdate: NoAction)
+}
+
+model session {
+  expiredAt BigInt
+  id        String @id
+  json      String
+
+  @@index([expiredAt], map: "IDX_28c5d1d16da7908c97c9bc2f74")
+}
+
+model user {
+  id                                              Int             @id @default(autoincrement())
+  email                                           String          @unique(map: "sqlite_autoindex_user_1")
+  username                                        String?
+  plexId                                          Int?
+  plexToken                                       String?
+  permissions                                     Int             @default(0)
+  avatar                                          String
+  createdAt                                       DateTime        @default(now())
+  updatedAt                                       DateTime        @default(now())
+  password                                        String?
+  userType                                        Int             @default(1)
+  plexUsername                                    String?
+  resetPasswordGuid                               String?
+  recoveryLinkExpirationDate                      DateTime?
+  jellyfinUsername                                String?
+  jellyfinAuthToken                               String?
+  jellyfinUserId                                  String?
+  jellyfinDeviceId                                String?
+  media_request_media_request_modifiedByIdTouser  media_request[] @relation("media_request_modifiedByIdTouser")
+  media_request_media_request_requestedByIdTouser media_request[] @relation("media_request_requestedByIdTouser")
+  user_settings                                   user_settings?
+}
+
+model user_settings {
+  id                  Int     @id @default(autoincrement())
+  enableNotifications Boolean @default(true)
+  discordId           String?
+  userId              Int?    @unique(map: "sqlite_autoindex_user_settings_1")
+  region              String?
+  originalLanguage    String?
+  user                user?   @relation(fields: [userId], references: [id], onDelete: Cascade, onUpdate: NoAction)
+}

server/api/jellyfin.ts

@@ -0,0 +1,267 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import axios, { AxiosInstance } from 'axios';
+import logger from '../logger';
+
+export interface JellyfinUserResponse {
+  Name: string;
+  ServerId: string;
+  ServerName: string;
+  Id: string;
+  PrimaryImageTag?: string;
+}
+
+export interface JellyfinLoginResponse {
+  User: JellyfinUserResponse;
+  AccessToken: string;
+}
+
+export interface JellyfinLibrary {
+  type: 'show' | 'movie';
+  key: string;
+  title: string;
+  agent: string;
+}
+
+export interface JellyfinLibraryItem {
+  Name: string;
+  Id: string;
+  HasSubtitles: boolean;
+  Type: 'Movie' | 'Episode' | 'Season' | 'Series';
+  SeriesName?: string;
+  SeriesId?: string;
+  SeasonId?: string;
+  SeasonName?: string;
+  IndexNumber?: number;
+  ParentIndexNumber?: number;
+  MediaType: string;
+}
+
+export interface JellyfinMediaStream {
+  Codec: string;
+  Type: 'Video' | 'Audio' | 'Subtitle';
+  Height?: number;
+  Width?: number;
+  AverageFrameRate?: number;
+  RealFrameRate?: number;
+  Language?: string;
+  DisplayTitle: string;
+}
+
+export interface JellyfinMediaSource {
+  Protocol: string;
+  Id: string;
+  Path: string;
+  Type: string;
+  VideoType: string;
+  MediaStreams: JellyfinMediaStream[];
+}
+
+export interface JellyfinLibraryItemExtended extends JellyfinLibraryItem {
+  ProviderIds: {
+    Tmdb?: string;
+    Imdb?: string;
+    Tvdb?: string;
+  };
+  MediaSources?: JellyfinMediaSource[];
+  Width?: number;
+  Height?: number;
+  IsHD?: boolean;
+  DateCreated?: string;
+}
+
+class JellyfinAPI {
+  private authToken?: string;
+  private userId?: string;
+  private jellyfinHost: string;
+  private axios: AxiosInstance;
+
+  constructor(jellyfinHost: string, authToken?: string, deviceId?: string) {
+    this.jellyfinHost = jellyfinHost;
+    this.authToken = authToken;
+
+    let authHeaderVal = '';
+    if (this.authToken) {
+      authHeaderVal = `MediaBrowser Client="Overseerr", Device="Axios", DeviceId="${deviceId}", Version="10.8.0", Token="${authToken}"`;
+    } else {
+      authHeaderVal = `MediaBrowser Client="Overseerr", Device="Axios", DeviceId="${deviceId}", Version="10.8.0"`;
+    }
+
+    this.axios = axios.create({
+      baseURL: this.jellyfinHost,
+      headers: {
+        'X-Emby-Authorization': authHeaderVal,
+        'Content-Type': 'application/json',
+        Accept: 'application/json',
+      },
+    });
+  }
+
+  public async login(
+    Username?: string,
+    Password?: string
+  ): Promise<JellyfinLoginResponse> {
+    try {
+      const account = await this.axios.post<JellyfinLoginResponse>(
+        '/Users/AuthenticateByName',
+        {
+          Username: Username,
+          Pw: Password,
+        }
+      );
+      return account.data;
+    } catch (e) {
+      throw new Error('Unauthorized');
+    }
+  }
+
+  public setUserId(userId: string): void {
+    this.userId = userId;
+    return;
+  }
+
+  public async getServerName(): Promise<string> {
+    try {
+      const account = await this.axios.get<JellyfinUserResponse>(
+        `/System/Info/Public'}`
+      );
+      return account.data.ServerName;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting the server name from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('girl idk');
+    }
+  }
+
+  public async getUser(): Promise<JellyfinUserResponse> {
+    try {
+      const account = await this.axios.get<JellyfinUserResponse>(
+        `/Users/${this.userId ?? 'Me'}`
+      );
+      return account.data;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting the account from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('Invalid auth token');
+    }
+  }
+
+  public async getLibraries(): Promise<JellyfinLibrary[]> {
+    try {
+      const account = await this.axios.get<any>(
+        `/Users/${this.userId ?? 'Me'}/Views`
+      );
+
+      const response: JellyfinLibrary[] = account.data.Items.filter(
+        (Item: any) => {
+          return (
+            Item.Type === 'CollectionFolder' &&
+            (Item.CollectionType === 'tvshows' ||
+              Item.CollectionType === 'movies')
+          );
+        }
+      ).map((Item: any) => {
+        return <JellyfinLibrary>{
+          key: Item.Id,
+          title: Item.Name,
+          type: Item.CollectionType === 'movies' ? 'movie' : 'show',
+          agent: 'jellyfin',
+        };
+      });
+
+      return response;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting libraries from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      return [];
+    }
+  }
+
+  public async getLibraryContents(id: string): Promise<JellyfinLibraryItem[]> {
+    try {
+      const contents = await this.axios.get<any>(
+        `/Users/${this.userId}/Items?SortBy=SortName&SortOrder=Ascending&IncludeItemTypes=Series,Movie&Recursive=true&StartIndex=0&ParentId=${id}`
+      );
+
+      return contents.data.Items;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting library content from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('Invalid auth token');
+    }
+  }
+
+  public async getRecentlyAdded(id: string): Promise<JellyfinLibraryItem[]> {
+    try {
+      const contents = await this.axios.get<any>(
+        `/Users/${this.userId}/Items/Latest?Limit=12&ParentId=${id}`
+      );
+
+      return contents.data;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting library content from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('Invalid auth token');
+    }
+  }
+
+  public async getItemData(id: string): Promise<JellyfinLibraryItemExtended> {
+    try {
+      const contents = await this.axios.get<any>(
+        `/Users/${this.userId}/Items/${id}`
+      );
+
+      return contents.data;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting library content from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('Invalid auth token');
+    }
+  }
+
+  public async getSeasons(seriesID: string): Promise<JellyfinLibraryItem[]> {
+    try {
+      const contents = await this.axios.get<any>(`/Shows/${seriesID}/Seasons`);
+
+      return contents.data.Items;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting the list of seasons from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('Invalid auth token');
+    }
+  }
+
+  public async getEpisodes(
+    seriesID: string,
+    seasonID: string
+  ): Promise<JellyfinLibraryItem[]> {
+    try {
+      const contents = await this.axios.get<any>(
+        `/Shows/${seriesID}/Episodes?seasonId=${seasonID}`
+      );
+
+      return contents.data.Items;
+    } catch (e) {
+      logger.error(
+        `Something went wrong while getting the list of episodes from the Jellyfin server: ${e.message}`,
+        { label: 'Jellyfin API' }
+      );
+      throw new Error('Invalid auth token');
+    }
+  }
+}
+
+export default JellyfinAPI;

server/constants/server.ts

@@ -0,0 +1,6 @@
+export enum MediaServerType {
+  PLEX = 1,
+  JELLYFIN,
+  EMBY,
+  NOT_CONFIGURED,
+}

server/constants/user.ts

@@ -1,4 +1,5 @@
 export enum UserType {
   PLEX = 1,
   LOCAL = 2,
+  JELLYFIN = 3,
 }

server/entity/Media.ts

@@ -13,6 +13,7 @@ import {
 import RadarrAPI from '../api/servarr/radarr';
 import SonarrAPI from '../api/servarr/sonarr';
 import { MediaStatus, MediaType } from '../constants/media';
+import { MediaServerType } from '../constants/server';
 import downloadTracker, { DownloadingItem } from '../lib/downloadtracker';
 import { getSettings } from '../lib/settings';
 import logger from '../logger';
@@ -133,36 +134,41 @@ class Media {
   @Column({ nullable: true })
   public ratingKey4k?: string;
 
+  @Column({ nullable: true })
+  public jellyfinMediaId?: string;
+
+  @Column({ nullable: true })
+  public jellyfinMediaId4k?: string;
+
   public serviceUrl?: string;
   public serviceUrl4k?: string;
   public downloadStatus?: DownloadingItem[] = [];
   public downloadStatus4k?: DownloadingItem[] = [];
 
-  public plexUrl?: string;
-  public plexUrl4k?: string;
+  public mediaUrl?: string;
+  public mediaUrl4k?: string;
 
   constructor(init?: Partial<Media>) {
     Object.assign(this, init);
   }
 
   @AfterLoad()
-  public setPlexUrls(): void {
-    const { machineId, webAppUrl } = getSettings().plex;
-
-    if (this.ratingKey) {
-      this.plexUrl = `${
-        webAppUrl ? webAppUrl : 'https://app.plex.tv/desktop'
-      }#!/server/${machineId}/details?key=%2Flibrary%2Fmetadata%2F${
-        this.ratingKey
-      }`;
-    }
-
-    if (this.ratingKey4k) {
-      this.plexUrl4k = `${
-        webAppUrl ? webAppUrl : 'https://app.plex.tv/desktop'
-      }#!/server/${machineId}/details?key=%2Flibrary%2Fmetadata%2F${
-        this.ratingKey4k
-      }`;
+  public setMediaUrls(): void {
+    const settings = getSettings();
+    if (settings.main.mediaServerType == MediaServerType.PLEX) {
+      if (this.ratingKey) {
+        this.mediaUrl = `https://app.plex.tv/desktop#!/server/${settings.plex.machineId}/details?key=%2Flibrary%2Fmetadata%2F${this.ratingKey}`;
+      }
+      if (this.ratingKey4k) {
+        this.mediaUrl4k = `https://app.plex.tv/desktop#!/server/${settings.plex.machineId}/details?key=%2Flibrary%2Fmetadata%2F${this.ratingKey4k}`;
+      }
+    } else {
+      if (this.jellyfinMediaId) {
+        this.mediaUrl = `${settings.jellyfin.hostname}/web/index.html#!/details?id=${this.jellyfinMediaId}&context=home&serverId=${settings.jellyfin.serverId}`;
+      }
+      if (this.jellyfinMediaId4k) {
+        this.mediaUrl4k = `${settings.jellyfin.hostname}/web/index.html#!/details?id=${this.jellyfinMediaId4k}&context=home&serverId=${settings.jellyfin.serverId}`;
+      }
     }
   }
 

server/entity/User.ts

@@ -60,6 +60,9 @@ export class User {
   @Column({ nullable: true })
   public plexUsername?: string;
 
+  @Column({ nullable: true })
+  public jellyfinUsername: string;
+
   @Column({ nullable: true })
   public username?: string;
 
@@ -75,10 +78,19 @@ export class User {
   @Column({ type: 'integer', default: UserType.PLEX })
   public userType: UserType;
 
-  @Column({ nullable: true, select: false })
+  @Column({ nullable: true })
   public plexId?: number;
 
-  @Column({ nullable: true, select: false })
+  @Column({ nullable: true })
+  public jellyfinUserId?: string;
+
+  @Column({ nullable: true })
+  public jellyfinDeviceId?: string;
+
+  @Column({ nullable: true })
+  public jellyfinAuthToken?: string;
+
+  @Column({ nullable: true })
   public plexToken?: string;
 
   @Column({ type: 'integer', default: 0 })
@@ -226,6 +238,8 @@ export class User {
 
   @AfterLoad()
   public setDisplayName(): void {
+    this.displayName =
+      this.username || this.plexUsername || this.jellyfinUsername;
     this.displayName = this.username || this.plexUsername || this.email;
   }
 

server/index.ts

@@ -1,18 +1,14 @@
+import { PrismaClient } from '@prisma/client';
 import { getClientIp } from '@supercharge/request-ip';
-import { TypeormStore } from 'connect-typeorm/out';
 import cookieParser from 'cookie-parser';
 import csurf from 'csurf';
 import express, { NextFunction, Request, Response } from 'express';
 import * as OpenApiValidator from 'express-openapi-validator';
-import session, { Store } from 'express-session';
 import next from 'next';
 import path from 'path';
 import swaggerUi from 'swagger-ui-express';
-import { createConnection, getRepository } from 'typeorm';
 import YAML from 'yamljs';
 import PlexAPI from './api/plexapi';
-import { Session } from './entity/Session';
-import { User } from './entity/User';
 import { startJobs } from './job/schedule';
 import notificationManager from './lib/notifications';
 import DiscordAgent from './lib/notifications/agents/discord';
@@ -35,18 +31,17 @@ logger.info(`Starting Overseerr version ${getAppVersion()}`);
 const dev = process.env.NODE_ENV !== 'production';
 const app = next({ dev });
 const handle = app.getRequestHandler();
+const prisma = new PrismaClient();
 
 app
   .prepare()
   .then(async () => {
-    const dbConnection = await createConnection();
-
-    // Run migrations in production
-    if (process.env.NODE_ENV === 'production') {
-      await dbConnection.query('PRAGMA foreign_keys=OFF');
-      await dbConnection.runMigrations();
-      await dbConnection.query('PRAGMA foreign_keys=ON');
-    }
+    // // Run migrations in production
+    // if (process.env.NODE_ENV === 'production') {
+    //   await dbConnection.query('PRAGMA foreign_keys=OFF');
+    //   await dbConnection.runMigrations();
+    //   await dbConnection.query('PRAGMA foreign_keys=ON');
+    // }
 
     // Load Settings
     const settings = getSettings().load();
@@ -56,14 +51,23 @@ app
       settings.plex.libraries.length > 1 &&
       !settings.plex.libraries[0].type
     ) {
-      const userRepository = getRepository(User);
-      const admin = await userRepository.findOne({
-        select: ['id', 'plexToken'],
-        order: { id: 'ASC' },
+      const admin = await prisma.user.findFirst({
+        select: {
+          id: true,
+          plexToken: true,
+        },
+        orderBy: {
+          id: 'asc',
+        },
       });
+      // const userRepository = getRepository(User);
+      // const admin = await userRepository.findOne({
+      //   select: ['id', 'plexToken'],
+      //   order: { id: 'ASC' },
+      // });
 
       if (admin) {
-        const plexapi = new PlexAPI({ plexToken: admin.plexToken });
+        const plexapi = new PlexAPI({ plexToken: admin.plexToken! });
         await plexapi.syncLibraries();
         logger.info('Migrating libraries to include media type', {
           label: 'Settings',
@@ -129,22 +133,24 @@ app
     }
 
     // Set up sessions
-    const sessionRespository = getRepository(Session);
-    server.use(
-      '/api',
-      session({
-        secret: settings.clientId,
-        resave: false,
-        saveUninitialized: false,
-        cookie: {
-          maxAge: 1000 * 60 * 60 * 24 * 30,
-        },
-        store: new TypeormStore({
-          cleanupLimit: 2,
-          ttl: 1000 * 60 * 60 * 24 * 30,
-        }).connect(sessionRespository) as Store,
-      })
-    );
+    // const sessionRespository = getRepository(Session);
+    // const sessionRespository = await prisma.session.findMany();
+
+    // server.use(
+    //   '/api',
+    //   session({
+    //     secret: settings.clientId,
+    //     resave: false,
+    //     saveUninitialized: false,
+    //     cookie: {
+    //       maxAge: 1000 * 60 * 60 * 24 * 30,
+    //     },
+    //     store: new TypeormStore({
+    //       cleanupLimit: 2,
+    //       ttl: 1000 * 60 * 60 * 24 * 30,
+    //     }).connect(sessionRespository) as Store,
+    //   })
+    // );
     const apiDocs = YAML.load(API_SPEC_PATH);
     server.use('/api-docs', swaggerUi.serve, swaggerUi.setup(apiDocs));
     server.use(

server/interfaces/api/settingsInterfaces.ts

@@ -20,6 +20,8 @@ export interface SettingsAboutResponse {
 }
 
 export interface PublicSettingsResponse {
+  jellyfinHost?: string;
+  jellyfinServerName?: string;
   initialized: boolean;
   applicationTitle: string;
   applicationUrl: string;
@@ -29,6 +31,7 @@ export interface PublicSettingsResponse {
   series4kEnabled: boolean;
   region: string;
   originalLanguage: string;
+  mediaServerType: number;
   partialRequestsEnabled: boolean;
   cacheImages: boolean;
   vapidPublic: string;

server/job/jellyfinsync/index.ts

@@ -0,0 +1,665 @@
+import { randomUUID as uuid } from 'crypto';
+import { uniqWith } from 'lodash';
+import { getRepository } from 'typeorm';
+import JellyfinAPI, { JellyfinLibraryItem } from '../../api/jellyfin';
+import TheMovieDb from '../../api/themoviedb';
+import { TmdbTvDetails } from '../../api/themoviedb/interfaces';
+import { MediaStatus, MediaType } from '../../constants/media';
+import { MediaServerType } from '../../constants/server';
+import Media from '../../entity/Media';
+import Season from '../../entity/Season';
+import { User } from '../../entity/User';
+import { getSettings, Library } from '../../lib/settings';
+import logger from '../../logger';
+import AsyncLock from '../../utils/asyncLock';
+
+const BUNDLE_SIZE = 20;
+const UPDATE_RATE = 4 * 1000;
+
+interface SyncStatus {
+  running: boolean;
+  progress: number;
+  total: number;
+  currentLibrary: Library;
+  libraries: Library[];
+}
+
+class JobJellyfinSync {
+  private sessionId: string;
+  private tmdb: TheMovieDb;
+  private jfClient: JellyfinAPI;
+  private items: JellyfinLibraryItem[] = [];
+  private progress = 0;
+  private libraries: Library[];
+  private currentLibrary: Library;
+  private running = false;
+  private isRecentOnly = false;
+  private enable4kMovie = false;
+  private enable4kShow = false;
+  private asyncLock = new AsyncLock();
+
+  constructor({ isRecentOnly }: { isRecentOnly?: boolean } = {}) {
+    this.tmdb = new TheMovieDb();
+    this.isRecentOnly = isRecentOnly ?? false;
+  }
+
+  private async getExisting(tmdbId: number, mediaType: MediaType) {
+    const mediaRepository = getRepository(Media);
+
+    const existing = await mediaRepository.findOne({
+      where: { tmdbId: tmdbId, mediaType },
+    });
+
+    return existing;
+  }
+
+  private async processMovie(jellyfinitem: JellyfinLibraryItem) {
+    const mediaRepository = getRepository(Media);
+
+    try {
+      const metadata = await this.jfClient.getItemData(jellyfinitem.Id);
+      const newMedia = new Media();
+
+      if (!metadata.Id) {
+        logger.debug('No Id metadata for this title. Skipping', {
+          label: 'Plex Sync',
+          ratingKey: jellyfinitem.Id,
+        });
+        return;
+      }
+
+      newMedia.tmdbId = Number(metadata.ProviderIds.Tmdb ?? null);
+      newMedia.imdbId = metadata.ProviderIds.Imdb;
+      if (newMedia.imdbId && !isNaN(newMedia.tmdbId)) {
+        const tmdbMovie = await this.tmdb.getMovieByImdbId({
+          imdbId: newMedia.imdbId,
+        });
+        newMedia.tmdbId = tmdbMovie.id;
+      }
+      if (!newMedia.tmdbId) {
+        throw new Error('Unable to find TMDb ID');
+      }
+
+      const has4k = metadata.MediaSources?.some((MediaSource) => {
+        return MediaSource.MediaStreams.some((MediaStream) => {
+          return (MediaStream.Width ?? 0) > 2000;
+        });
+      });
+
+      const hasOtherResolution = metadata.MediaSources?.some((MediaSource) => {
+        return MediaSource.MediaStreams.some((MediaStream) => {
+          return (MediaStream.Width ?? 0) <= 2000;
+        });
+      });
+
+      await this.asyncLock.dispatch(newMedia.tmdbId, async () => {
+        const existing = await this.getExisting(
+          newMedia.tmdbId,
+          MediaType.MOVIE
+        );
+
+        if (existing) {
+          let changedExisting = false;
+
+          if (
+            (hasOtherResolution || (!this.enable4kMovie && has4k)) &&
+            existing.status !== MediaStatus.AVAILABLE
+          ) {
+            existing.status = MediaStatus.AVAILABLE;
+            existing.mediaAddedAt = new Date(metadata.DateCreated ?? '');
+            changedExisting = true;
+          }
+
+          if (
+            has4k &&
+            this.enable4kMovie &&
+            existing.status4k !== MediaStatus.AVAILABLE
+          ) {
+            existing.status4k = MediaStatus.AVAILABLE;
+            changedExisting = true;
+          }
+
+          if (!existing.mediaAddedAt && !changedExisting) {
+            existing.mediaAddedAt = new Date(metadata.DateCreated ?? '');
+            changedExisting = true;
+          }
+
+          if (
+            (hasOtherResolution || (has4k && !this.enable4kMovie)) &&
+            existing.jellyfinMediaId !== metadata.Id
+          ) {
+            existing.jellyfinMediaId = metadata.Id;
+            changedExisting = true;
+          }
+
+          if (
+            has4k &&
+            this.enable4kMovie &&
+            existing.jellyfinMediaId4k !== metadata.Id
+          ) {
+            existing.jellyfinMediaId4k = metadata.Id;
+            changedExisting = true;
+          }
+
+          if (changedExisting) {
+            await mediaRepository.save(existing);
+            this.log(
+              `Request for ${metadata.Name} exists. New media types set to AVAILABLE`,
+              'info'
+            );
+          } else {
+            this.log(
+              `Title already exists and no new media types found ${metadata.Name}`
+            );
+          }
+        } else {
+          newMedia.status =
+            hasOtherResolution || (!this.enable4kMovie && has4k)
+              ? MediaStatus.AVAILABLE
+              : MediaStatus.UNKNOWN;
+          newMedia.status4k =
+            has4k && this.enable4kMovie
+              ? MediaStatus.AVAILABLE
+              : MediaStatus.UNKNOWN;
+          newMedia.mediaType = MediaType.MOVIE;
+          newMedia.mediaAddedAt = new Date(metadata.DateCreated ?? '');
+          newMedia.jellyfinMediaId =
+            hasOtherResolution || (!this.enable4kMovie && has4k)
+              ? metadata.Id
+              : undefined;
+          newMedia.jellyfinMediaId4k =
+            has4k && this.enable4kMovie ? metadata.Id : undefined;
+          await mediaRepository.save(newMedia);
+          this.log(`Saved ${metadata.Name}`);
+        }
+      });
+    } catch (e) {
+      this.log(
+        `Failed to process Jellyfin item, id: ${jellyfinitem.Id}`,
+        'error',
+        {
+          errorMessage: e.message,
+          jellyfinitem,
+        }
+      );
+    }
+  }
+
+  private async processShow(jellyfinitem: JellyfinLibraryItem) {
+    const mediaRepository = getRepository(Media);
+
+    let tvShow: TmdbTvDetails | null = null;
+
+    try {
+      const Id =
+        jellyfinitem.SeriesId ?? jellyfinitem.SeasonId ?? jellyfinitem.Id;
+      const metadata = await this.jfClient.getItemData(Id);
+
+      if (metadata.ProviderIds.Tvdb) {
+        tvShow = await this.tmdb.getShowByTvdbId({
+          tvdbId: Number(metadata.ProviderIds.Tvdb),
+        });
+      } else if (metadata.ProviderIds.Tmdb) {
+        tvShow = await this.tmdb.getTvShow({
+          tvId: Number(metadata.ProviderIds.Tmdb),
+        });
+      }
+
+      if (tvShow) {
+        await this.asyncLock.dispatch(tvShow.id, async () => {
+          if (!tvShow) {
+            // this will never execute, but typescript thinks somebody could reset tvShow from
+            // outer scope back to null before this async gets called
+            return;
+          }
+
+          // Lets get the available seasons from Jellyfin
+          const seasons = tvShow.seasons;
+          const media = await this.getExisting(tvShow.id, MediaType.TV);
+
+          const newSeasons: Season[] = [];
+
+          const currentStandardSeasonAvailable = (
+            media?.seasons.filter(
+              (season) => season.status === MediaStatus.AVAILABLE
+            ) ?? []
+          ).length;
+          const current4kSeasonAvailable = (
+            media?.seasons.filter(
+              (season) => season.status4k === MediaStatus.AVAILABLE
+            ) ?? []
+          ).length;
+
+          for (const season of seasons) {
+            const JellyfinSeasons = await this.jfClient.getSeasons(Id);
+            const matchedJellyfinSeason = JellyfinSeasons.find(
+              (md) => Number(md.IndexNumber) === season.season_number
+            );
+
+            const existingSeason = media?.seasons.find(
+              (es) => es.seasonNumber === season.season_number
+            );
+
+            // Check if we found the matching season and it has all the available episodes
+            if (matchedJellyfinSeason) {
+              // If we have a matched Jellyfin season, get its children metadata so we can check details
+              const episodes = await this.jfClient.getEpisodes(
+                Id,
+                matchedJellyfinSeason.Id
+              );
+
+              //Get count of episodes that are HD and 4K
+              let totalStandard = 0;
+              let total4k = 0;
+
+              //use for loop to make sure this loop _completes_ in full
+              //before the next section
+              for (const episode of episodes) {
+                if (!this.enable4kShow) {
+                  totalStandard++;
+                } else {
+                  const ExtendedEpisodeData = await this.jfClient.getItemData(
+                    episode.Id
+                  );
+
+                  ExtendedEpisodeData.MediaSources?.some((MediaSource) => {
+                    return MediaSource.MediaStreams.some((MediaStream) => {
+                      if (MediaStream.Type === 'Video') {
+                        if (MediaStream.Width ?? 0 < 2000) {
+                          totalStandard++;
+                        }
+                      } else {
+                        total4k++;
+                      }
+                    });
+                  });
+                }
+              }
+
+              if (
+                media &&
+                (totalStandard > 0 || (total4k > 0 && !this.enable4kShow)) &&
+                media.jellyfinMediaId !== Id
+              ) {
+                media.jellyfinMediaId = Id;
+              }
+
+              if (
+                media &&
+                total4k > 0 &&
+                this.enable4kShow &&
+                media.jellyfinMediaId4k !== Id
+              ) {
+                media.jellyfinMediaId4k = Id;
+              }
+
+              if (existingSeason) {
+                // These ternary statements look super confusing, but they are simply
+                // setting the status to AVAILABLE if all of a type is there, partially if some,
+                // and then not modifying the status if there are 0 items
+                existingSeason.status =
+                  totalStandard === season.episode_count
+                    ? MediaStatus.AVAILABLE
+                    : totalStandard > 0
+                    ? MediaStatus.PARTIALLY_AVAILABLE
+                    : existingSeason.status;
+                existingSeason.status4k =
+                  this.enable4kShow && total4k === season.episode_count
+                    ? MediaStatus.AVAILABLE
+                    : this.enable4kShow && total4k > 0
+                    ? MediaStatus.PARTIALLY_AVAILABLE
+                    : existingSeason.status4k;
+              } else {
+                newSeasons.push(
+                  new Season({
+                    seasonNumber: season.season_number,
+                    // This ternary is the same as the ones above, but it just falls back to "UNKNOWN"
+                    // if we dont have any items for the season
+                    status:
+                      totalStandard === season.episode_count
+                        ? MediaStatus.AVAILABLE
+                        : totalStandard > 0
+                        ? MediaStatus.PARTIALLY_AVAILABLE
+                        : MediaStatus.UNKNOWN,
+                    status4k:
+                      this.enable4kShow && total4k === season.episode_count
+                        ? MediaStatus.AVAILABLE
+                        : this.enable4kShow && total4k > 0
+                        ? MediaStatus.PARTIALLY_AVAILABLE
+                        : MediaStatus.UNKNOWN,
+                  })
+                );
+              }
+            }
+          }
+
+          // Remove extras season. We dont count it for determining availability
+          const filteredSeasons = tvShow.seasons.filter(
+            (season) => season.season_number !== 0
+          );
+
+          const isAllStandardSeasons =
+            newSeasons.filter(
+              (season) => season.status === MediaStatus.AVAILABLE
+            ).length +
+              (media?.seasons.filter(
+                (season) => season.status === MediaStatus.AVAILABLE
+              ).length ?? 0) >=
+            filteredSeasons.length;
+
+          const isAll4kSeasons =
+            newSeasons.filter(
+              (season) => season.status4k === MediaStatus.AVAILABLE
+            ).length +
+              (media?.seasons.filter(
+                (season) => season.status4k === MediaStatus.AVAILABLE
+              ).length ?? 0) >=
+            filteredSeasons.length;
+
+          if (media) {
+            // Update existing
+            media.seasons = [...media.seasons, ...newSeasons];
+
+            const newStandardSeasonAvailable = (
+              media.seasons.filter(
+                (season) => season.status === MediaStatus.AVAILABLE
+              ) ?? []
+            ).length;
+
+            const new4kSeasonAvailable = (
+              media.seasons.filter(
+                (season) => season.status4k === MediaStatus.AVAILABLE
+              ) ?? []
+            ).length;
+
+            // If at least one new season has become available, update
+            // the lastSeasonChange field so we can trigger notifications
+            if (newStandardSeasonAvailable > currentStandardSeasonAvailable) {
+              this.log(
+                `Detected ${
+                  newStandardSeasonAvailable - currentStandardSeasonAvailable
+                } new standard season(s) for ${tvShow.name}`,
+                'debug'
+              );
+              media.lastSeasonChange = new Date();
+              media.mediaAddedAt = new Date(metadata.DateCreated ?? '');
+            }
+
+            if (new4kSeasonAvailable > current4kSeasonAvailable) {
+              this.log(
+                `Detected ${
+                  new4kSeasonAvailable - current4kSeasonAvailable
+                } new 4K season(s) for ${tvShow.name}`,
+                'debug'
+              );
+              media.lastSeasonChange = new Date();
+            }
+
+            if (!media.mediaAddedAt) {
+              media.mediaAddedAt = new Date(metadata.DateCreated ?? '');
+            }
+
+            // If the show is already available, and there are no new seasons, dont adjust
+            // the status
+            const shouldStayAvailable =
+              media.status === MediaStatus.AVAILABLE &&
+              newSeasons.filter(
+                (season) => season.status !== MediaStatus.UNKNOWN
+              ).length === 0;
+            const shouldStayAvailable4k =
+              media.status4k === MediaStatus.AVAILABLE &&
+              newSeasons.filter(
+                (season) => season.status4k !== MediaStatus.UNKNOWN
+              ).length === 0;
+
+            media.status =
+              isAllStandardSeasons || shouldStayAvailable
+                ? MediaStatus.AVAILABLE
+                : media.seasons.some(
+                    (season) => season.status !== MediaStatus.UNKNOWN
+                  )
+                ? MediaStatus.PARTIALLY_AVAILABLE
+                : MediaStatus.UNKNOWN;
+            media.status4k =
+              (isAll4kSeasons || shouldStayAvailable4k) && this.enable4kShow
+                ? MediaStatus.AVAILABLE
+                : this.enable4kShow &&
+                  media.seasons.some(
+                    (season) => season.status4k !== MediaStatus.UNKNOWN
+                  )
+                ? MediaStatus.PARTIALLY_AVAILABLE
+                : MediaStatus.UNKNOWN;
+            await mediaRepository.save(media);
+            this.log(`Updating existing title: ${tvShow.name}`);
+          } else {
+            const newMedia = new Media({
+              mediaType: MediaType.TV,
+              seasons: newSeasons,
+              tmdbId: tvShow.id,
+              tvdbId: tvShow.external_ids.tvdb_id,
+              mediaAddedAt: new Date(metadata.DateCreated ?? ''),
+              jellyfinMediaId: Id,
+              jellyfinMediaId4k: Id,
+              status: isAllStandardSeasons
+                ? MediaStatus.AVAILABLE
+                : newSeasons.some(
+                    (season) => season.status !== MediaStatus.UNKNOWN
+                  )
+                ? MediaStatus.PARTIALLY_AVAILABLE
+                : MediaStatus.UNKNOWN,
+              status4k:
+                isAll4kSeasons && this.enable4kShow
+                  ? MediaStatus.AVAILABLE
+                  : this.enable4kShow &&
+                    newSeasons.some(
+                      (season) => season.status4k !== MediaStatus.UNKNOWN
+                    )
+                  ? MediaStatus.PARTIALLY_AVAILABLE
+                  : MediaStatus.UNKNOWN,
+            });
+            await mediaRepository.save(newMedia);
+            this.log(`Saved ${tvShow.name}`);
+          }
+        });
+      } else {
+        this.log(`failed show: ${metadata.Name}`);
+      }
+    } catch (e) {
+      this.log(
+        `Failed to process Jellyfin item. Id: ${
+          jellyfinitem.SeriesId ?? jellyfinitem.SeasonId ?? jellyfinitem.Id
+        }`,
+        'error',
+        {
+          errorMessage: e.message,
+          jellyfinitem,
+        }
+      );
+    }
+  }
+
+  private async processItems(slicedItems: JellyfinLibraryItem[]) {
+    await Promise.all(
+      slicedItems.map(async (item) => {
+        if (item.Type === 'Movie') {
+          await this.processMovie(item);
+        } else if (item.Type === 'Series') {
+          await this.processShow(item);
+        }
+      })
+    );
+  }
+
+  private async loop({
+    start = 0,
+    end = BUNDLE_SIZE,
+    sessionId,
+  }: {
+    start?: number;
+    end?: number;
+    sessionId?: string;
+  } = {}) {
+    const slicedItems = this.items.slice(start, end);
+
+    if (!this.running) {
+      throw new Error('Sync was aborted.');
+    }
+
+    if (this.sessionId !== sessionId) {
+      throw new Error('New session was started. Old session aborted.');
+    }
+
+    if (start < this.items.length) {
+      this.progress = start;
+      await this.processItems(slicedItems);
+
+      await new Promise<void>((resolve, reject) =>
+        setTimeout(() => {
+          this.loop({
+            start: start + BUNDLE_SIZE,
+            end: end + BUNDLE_SIZE,
+            sessionId,
+          })
+            .then(() => resolve())
+            .catch((e) => reject(new Error(e.message)));
+        }, UPDATE_RATE)
+      );
+    }
+  }
+
+  private log(
+    message: string,
+    level: 'info' | 'error' | 'debug' | 'warn' = 'debug',
+    optional?: Record<string, unknown>
+  ): void {
+    logger[level](message, { label: 'Jellyfin Sync', ...optional });
+  }
+
+  public async run(): Promise<void> {
+    const settings = getSettings();
+
+    if (settings.main.mediaServerType != MediaServerType.JELLYFIN) {
+      return;
+    }
+
+    const sessionId = uuid();
+    this.sessionId = sessionId;
+    logger.info('Jellyfin Sync Starting', {
+      sessionId,
+      label: 'Jellyfin Sync',
+    });
+    try {
+      this.running = true;
+      const userRepository = getRepository(User);
+      const admin = await userRepository.findOne({
+        select: [
+          'id',
+          'jellyfinAuthToken',
+          'jellyfinUserId',
+          'jellyfinDeviceId',
+        ],
+        order: { id: 'ASC' },
+      });
+
+      if (!admin) {
+        return this.log('No admin configured. Jellyfin sync skipped.', 'warn');
+      }
+
+      this.jfClient = new JellyfinAPI(
+        settings.jellyfin.hostname ?? '',
+        admin.jellyfinAuthToken,
+        admin.jellyfinDeviceId
+      );
+
+      this.jfClient.setUserId(admin.jellyfinUserId ?? '');
+
+      this.libraries = settings.jellyfin.libraries.filter(
+        (library) => library.enabled
+      );
+
+      this.enable4kMovie = settings.radarr.some((radarr) => radarr.is4k);
+      if (this.enable4kMovie) {
+        this.log(
+          'At least one 4K Radarr server was detected. 4K movie detection is now enabled',
+          'info'
+        );
+      }
+
+      this.enable4kShow = settings.sonarr.some((sonarr) => sonarr.is4k);
+      if (this.enable4kShow) {
+        this.log(
+          'At least one 4K Sonarr server was detected. 4K series detection is now enabled',
+          'info'
+        );
+      }
+
+      if (this.isRecentOnly) {
+        for (const library of this.libraries) {
+          this.currentLibrary = library;
+          this.log(
+            `Beginning to process recently added for library: ${library.name}`,
+            'info'
+          );
+          const libraryItems = await this.jfClient.getRecentlyAdded(library.id);
+
+          // Bundle items up by rating keys
+          this.items = uniqWith(libraryItems, (mediaA, mediaB) => {
+            if (mediaA.SeriesId && mediaB.SeriesId) {
+              return mediaA.SeriesId === mediaB.SeriesId;
+            }
+
+            if (mediaA.SeasonId && mediaB.SeasonId) {
+              return mediaA.SeasonId === mediaB.SeasonId;
+            }
+
+            return mediaA.Id === mediaB.Id;
+          });
+
+          await this.loop({ sessionId });
+        }
+      } else {
+        for (const library of this.libraries) {
+          this.currentLibrary = library;
+          this.log(`Beginning to process library: ${library.name}`, 'info');
+          this.items = await this.jfClient.getLibraryContents(library.id);
+          await this.loop({ sessionId });
+        }
+      }
+      this.log(
+        this.isRecentOnly
+          ? 'Recently Added Scan Complete'
+          : 'Full Scan Complete',
+        'info'
+      );
+    } catch (e) {
+      logger.error('Sync interrupted', {
+        label: 'Jellyfin Sync',
+        errorMessage: e.message,
+      });
+    } finally {
+      // If a new scanning session hasnt started, set running back to false
+      if (this.sessionId === sessionId) {
+        this.running = false;
+      }
+    }
+  }
+
+  public status(): SyncStatus {
+    return {
+      running: this.running,
+      progress: this.progress,
+      total: this.items.length,
+      currentLibrary: this.currentLibrary,
+      libraries: this.libraries,
+    };
+  }
+
+  public cancel(): void {
+    this.running = false;
+  }
+}
+
+export const jobJellyfinFullSync = new JobJellyfinSync();
+export const jobJellyfinRecentSync = new JobJellyfinSync({
+  isRecentOnly: true,
+});

server/job/schedule.ts

@@ -1,9 +1,10 @@
 import schedule from 'node-schedule';
-import logger from '../logger';
 import downloadTracker from '../lib/downloadtracker';
 import { plexFullScanner, plexRecentScanner } from '../lib/scanners/plex';
 import { radarrScanner } from '../lib/scanners/radarr';
 import { sonarrScanner } from '../lib/scanners/sonarr';
+import logger from '../logger';
+import { jobJellyfinFullSync, jobJellyfinRecentSync } from './jellyfinsync';
 
 interface ScheduledJob {
   id: string;
@@ -47,6 +48,36 @@ export const startJobs = (): void => {
     cancelFn: () => plexFullScanner.cancel(),
   });
 
+  // Run recently added jellyfin sync every 5 minutes
+  scheduledJobs.push({
+    id: 'jellyfin-recently-added-sync',
+    name: 'Jellyfin Recently Added Sync',
+    type: 'process',
+    job: schedule.scheduleJob('0 */5 * * * *', () => {
+      logger.info('Starting scheduled job: Jellyfin Recently Added Sync', {
+        label: 'Jobs',
+      });
+      jobJellyfinRecentSync.run();
+    }),
+    running: () => jobJellyfinRecentSync.status().running,
+    cancelFn: () => jobJellyfinRecentSync.cancel(),
+  });
+
+  // Run full jellyfin sync every 24 hours
+  scheduledJobs.push({
+    id: 'jellyfin-full-sync',
+    name: 'Jellyfin Full Library Sync',
+    type: 'process',
+    job: schedule.scheduleJob('0 0 3 * * *', () => {
+      logger.info('Starting scheduled job: Jellyfin Full Sync', {
+        label: 'Jobs',
+      });
+      jobJellyfinFullSync.run();
+    }),
+    running: () => jobJellyfinFullSync.status().running,
+    cancelFn: () => jobJellyfinFullSync.cancel(),
+  });
+
   // Run full radarr scan every 24 hours
   scheduledJobs.push({
     id: 'radarr-scan',

server/lib/email/openpgpEncrypt.ts

@@ -1,4 +1,5 @@
 import { randomBytes } from 'crypto';
+import MailMessage from 'nodemailer/lib/mailer/mail-message';
 import * as openpgp from 'openpgp';
 import { Transform, TransformCallback } from 'stream';
 
@@ -25,7 +26,7 @@ class PGPEncryptor extends Transform {
 
   // just save the whole message
   _transform = (
-    chunk: any,
+    chunk: Uint8Array,
     _encoding: BufferEncoding,
     callback: TransformCallback
   ): void => {
@@ -166,17 +167,16 @@ class PGPEncryptor extends Transform {
 }
 
 export const openpgpEncrypt = (options: EncryptorOptions) => {
-  return function (mail: any, callback: () => unknown): void {
+  return function (mail: MailMessage, callback: () => unknown): void {
     if (!options.encryptionKeys.length) {
       setImmediate(callback);
     }
     mail.message.transform(
-      () =>
-        new PGPEncryptor({
-          signingKey: options.signingKey,
-          password: options.password,
-          encryptionKeys: options.encryptionKeys,
-        })
+      new PGPEncryptor({
+        signingKey: options.signingKey,
+        password: options.password,
+        encryptionKeys: options.encryptionKeys,
+      })
     );
     setImmediate(callback);
   };

server/lib/notifications/agents/discord.ts

@@ -91,8 +91,7 @@ interface DiscordWebhookPayload {
 
 class DiscordAgent
   extends BaseAgent<NotificationAgentDiscord>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentDiscord {
     if (this.settings) {
       return this.settings;

server/lib/notifications/agents/email.ts

@@ -16,8 +16,7 @@ import { BaseAgent, NotificationAgent, NotificationPayload } from './agent';
 
 class EmailAgent
   extends BaseAgent<NotificationAgentEmail>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentEmail {
     if (this.settings) {
       return this.settings;

server/lib/notifications/agents/lunasea.ts

@@ -7,8 +7,7 @@ import { BaseAgent, NotificationAgent, NotificationPayload } from './agent';
 
 class LunaSeaAgent
   extends BaseAgent<NotificationAgentLunaSea>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentLunaSea {
     if (this.settings) {
       return this.settings;

server/lib/notifications/agents/pushbullet.ts

@@ -12,8 +12,7 @@ interface PushbulletPayload {
 
 class PushbulletAgent
   extends BaseAgent<NotificationAgentPushbullet>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentPushbullet {
     if (this.settings) {
       return this.settings;

server/lib/notifications/agents/pushover.ts

@@ -18,8 +18,7 @@ interface PushoverPayload {
 
 class PushoverAgent
   extends BaseAgent<NotificationAgentPushover>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentPushover {
     if (this.settings) {
       return this.settings;
@@ -176,8 +175,13 @@ class PushoverAgent
     try {
       const endpoint = 'https://api.pushover.net/1/messages.json';
 
-      const { title, message, url, url_title, priority } =
-        this.constructMessageDetails(type, payload);
+      const {
+        title,
+        message,
+        url,
+        url_title,
+        priority,
+      } = this.constructMessageDetails(type, payload);
 
       await axios.post(endpoint, {
         token: settings.options.accessToken,

server/lib/notifications/agents/slack.ts

@@ -43,8 +43,7 @@ interface SlackBlockEmbed {
 
 class SlackAgent
   extends BaseAgent<NotificationAgentSlack>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentSlack {
     if (this.settings) {
       return this.settings;

server/lib/notifications/agents/telegram.ts

@@ -29,8 +29,7 @@ interface TelegramPhotoPayload {
 
 class TelegramAgent
   extends BaseAgent<NotificationAgentTelegram>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   private baseUrl = 'https://api.telegram.org/';
 
   protected getSettings(): NotificationAgentTelegram {

server/lib/notifications/agents/webhook.ts

@@ -40,8 +40,7 @@ const KeyMap: Record<string, string | KeyMapFunction> = {
 
 class WebhookAgent
   extends BaseAgent<NotificationAgentWebhook>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentWebhook {
     if (this.settings) {
       return this.settings;

server/lib/notifications/agents/webpush.ts

@@ -26,8 +26,7 @@ interface PushNotificationPayload {
 
 class WebPushAgent
   extends BaseAgent<NotificationAgentConfig>
-  implements NotificationAgent
-{
+  implements NotificationAgent {
   protected getSettings(): NotificationAgentConfig {
     if (this.settings) {
       return this.settings;

server/lib/scanners/baseScanner.ts

@@ -146,8 +146,9 @@ class BaseScanner<T> {
           existing[is4k ? 'externalServiceId4k' : 'externalServiceId'] !==
             externalServiceId
         ) {
-          existing[is4k ? 'externalServiceId4k' : 'externalServiceId'] =
-            externalServiceId;
+          existing[
+            is4k ? 'externalServiceId4k' : 'externalServiceId'
+          ] = externalServiceId;
           changedExisting = true;
         }
 
@@ -156,8 +157,9 @@ class BaseScanner<T> {
           existing[is4k ? 'externalServiceSlug4k' : 'externalServiceSlug'] !==
             externalServiceSlug
         ) {
-          existing[is4k ? 'externalServiceSlug4k' : 'externalServiceSlug'] =
-            externalServiceSlug;
+          existing[
+            is4k ? 'externalServiceSlug4k' : 'externalServiceSlug'
+          ] = externalServiceSlug;
           changedExisting = true;
         }
 
@@ -388,13 +390,15 @@ class BaseScanner<T> {
         }
 
         if (externalServiceId !== undefined) {
-          media[is4k ? 'externalServiceId4k' : 'externalServiceId'] =
-            externalServiceId;
+          media[
+            is4k ? 'externalServiceId4k' : 'externalServiceId'
+          ] = externalServiceId;
         }
 
         if (externalServiceSlug !== undefined) {
-          media[is4k ? 'externalServiceSlug4k' : 'externalServiceSlug'] =
-            externalServiceSlug;
+          media[
+            is4k ? 'externalServiceSlug4k' : 'externalServiceSlug'
+          ] = externalServiceSlug;
         }
 
         // If the show is already available, and there are no new seasons, dont adjust

server/lib/scanners/plex/index.ts

@@ -31,8 +31,7 @@ type SyncStatus = StatusBase & {
 
 class PlexScanner
   extends BaseScanner<PlexLibraryItem>
-  implements RunnableScanner<SyncStatus>
-{
+  implements RunnableScanner<SyncStatus> {
   private plexClient: PlexAPI;
   private libraries: Library[];
   private currentLibrary: Library;

server/lib/scanners/radarr/index.ts

@@ -10,8 +10,7 @@ type SyncStatus = StatusBase & {
 
 class RadarrScanner
   extends BaseScanner<RadarrMovie>
-  implements RunnableScanner<SyncStatus>
-{
+  implements RunnableScanner<SyncStatus> {
   private servers: RadarrSettings[];
   private currentServer: RadarrSettings;
   private radarrApi: RadarrAPI;

server/lib/scanners/sonarr/index.ts

@@ -16,8 +16,7 @@ type SyncStatus = StatusBase & {
 
 class SonarrScanner
   extends BaseScanner<SonarrSeries>
-  implements RunnableScanner<SyncStatus>
-{
+  implements RunnableScanner<SyncStatus> {
   private servers: SonarrSettings[];
   private currentServer: SonarrSettings;
   private sonarrApi: SonarrAPI;

server/lib/settings.ts

@@ -3,6 +3,7 @@ import fs from 'fs';
 import { merge } from 'lodash';
 import path from 'path';
 import webpush from 'web-push';
+import { MediaServerType } from '../constants/server';
 import { Permission } from './permissions';
 
 export interface Library {
@@ -35,6 +36,13 @@ export interface PlexSettings {
   webAppUrl?: string;
 }
 
+export interface JellyfinSettings {
+  name: string;
+  hostname?: string;
+  libraries: Library[];
+  serverId: string;
+}
+
 export interface DVRSettings {
   id: number;
   name: string;
@@ -90,6 +98,7 @@ export interface MainSettings {
   region: string;
   originalLanguage: string;
   trustProxy: boolean;
+  mediaServerType: number;
   partialRequestsEnabled: boolean;
   locale: string;
 }
@@ -107,6 +116,9 @@ interface FullPublicSettings extends PublicSettings {
   series4kEnabled: boolean;
   region: string;
   originalLanguage: string;
+  mediaServerType: number;
+  jellyfinHost?: string;
+  jellyfinServerName?: string;
   partialRequestsEnabled: boolean;
   cacheImages: boolean;
   vapidPublic: string;
@@ -221,6 +233,7 @@ interface AllSettings {
   vapidPrivate: string;
   main: MainSettings;
   plex: PlexSettings;
+  jellyfin: JellyfinSettings;
   radarr: RadarrSettings[];
   sonarr: SonarrSettings[];
   public: PublicSettings;
@@ -256,6 +269,7 @@ class Settings {
         region: '',
         originalLanguage: '',
         trustProxy: false,
+        mediaServerType: MediaServerType.NOT_CONFIGURED,
         partialRequestsEnabled: true,
         locale: 'en',
       },
@@ -266,6 +280,12 @@ class Settings {
         useSsl: false,
         libraries: [],
       },
+      jellyfin: {
+        name: '',
+        hostname: '',
+        libraries: [],
+        serverId: '',
+      },
       radarr: [],
       sonarr: [],
       public: {
@@ -372,6 +392,14 @@ class Settings {
     this.data.plex = data;
   }
 
+  get jellyfin(): JellyfinSettings {
+    return this.data.jellyfin;
+  }
+
+  set jellyfin(data: JellyfinSettings) {
+    this.data.jellyfin = data;
+  }
+
   get radarr(): RadarrSettings[] {
     return this.data.radarr;
   }
@@ -411,6 +439,8 @@ class Settings {
       ),
       region: this.data.main.region,
       originalLanguage: this.data.main.originalLanguage,
+      mediaServerType: this.main.mediaServerType,
+      jellyfinHost: this.jellyfin.hostname,
       partialRequestsEnabled: this.data.main.partialRequestsEnabled,
       cacheImages: this.data.main.cacheImages,
       vapidPublic: this.vapidPublic,

server/migration/1608217312474-AddUserRequestDeleteCascades.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddUserRequestDeleteCascades1608219049304
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddUserRequestDeleteCascades1608219049304';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1608477467935-AddLastSeasonChangeMedia.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddLastSeasonChangeMedia1608477467935
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddLastSeasonChangeMedia1608477467935';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1608477467936-ForceDropImdbUniqueConstraint.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class ForceDropImdbUniqueConstraint1608477467935
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'ForceDropImdbUniqueConstraint1608477467936';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1609236552057-RemoveTmdbIdUniqueConstraint.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class RemoveTmdbIdUniqueConstraint1609236552057
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'RemoveTmdbIdUniqueConstraint1609236552057';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1610522845513-AddMediaAddedFieldToMedia.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddMediaAddedFieldToMedia1610522845513
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddMediaAddedFieldToMedia1610522845513';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1611757511674-SonarrRadarrSyncServiceFields.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class SonarrRadarrSyncServiceFields1611757511674
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'SonarrRadarrSyncServiceFields1611757511674';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1612482778137-AddResetPasswordGuidAndExpiryDate.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddResetPasswordGuidAndExpiryDate1612482778137
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddResetPasswordGuidAndExpiryDate1612482778137';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1613379909641-AddJellyfinUserParams.ts

@@ -0,0 +1,67 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class AddJellyfinUserParams1613379909641 implements MigrationInterface {
+  name = 'AddJellyfinUserParams1613379909641';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `CREATE TABLE "temporary_user" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "email" varchar NOT NULL, "username" varchar, "plexId" integer, "plexToken" varchar, "permissions" integer NOT NULL DEFAULT (0), "avatar" varchar NOT NULL, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "password" varchar, "userType" integer NOT NULL DEFAULT (1), "plexUsername" varchar, "resetPasswordGuid" varchar, "recoveryLinkExpirationDate" date, "jellyfinUsername" varchar, "jellyfinId" varchar, "jellyfinAuthToken" varchar, CONSTRAINT "UQ_e12875dfb3b1d92d7d7c5377e22" UNIQUE ("email"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_user"("id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate") SELECT "id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate" FROM "user"`
+    );
+    await queryRunner.query(`DROP TABLE "user"`);
+    await queryRunner.query(`ALTER TABLE "temporary_user" RENAME TO "user"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(
+      `CREATE TABLE "temporary_media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "status4k" integer NOT NULL DEFAULT (1), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, "jellyfinMediaID" varchar, "jellyfinMediaID4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "createdAt", "updatedAt", "lastSeasonChange", "status4k", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "createdAt", "updatedAt", "lastSeasonChange", "status4k", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "media"`
+    );
+    await queryRunner.query(`DROP TABLE "media"`);
+    await queryRunner.query(`ALTER TABLE "temporary_media" RENAME TO "media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`ALTER TABLE "media" RENAME TO "temporary_media"`);
+    await queryRunner.query(
+      `CREATE TABLE "media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "status4k" integer NOT NULL DEFAULT (1), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "createdAt", "updatedAt", "lastSeasonChange", "status4k", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "createdAt", "updatedAt", "lastSeasonChange", "status4k", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "temporary_media"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(`ALTER TABLE "user" RENAME TO "temporary_user"`);
+    await queryRunner.query(
+      `CREATE TABLE "user" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "email" varchar NOT NULL, "username" varchar, "plexId" integer, "plexToken" varchar, "permissions" integer NOT NULL DEFAULT (0), "avatar" varchar NOT NULL, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "password" varchar, "userType" integer NOT NULL DEFAULT (1), "plexUsername" varchar, "resetPasswordGuid" varchar, "recoveryLinkExpirationDate" date, CONSTRAINT "UQ_e12875dfb3b1d92d7d7c5377e22" UNIQUE ("email"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "user"("id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate") SELECT "id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate" FROM "temporary_user"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_user"`);
+  }
+}

server/migration/1613412948344-ServerTypeEnum.ts

@@ -0,0 +1,91 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class ServerTypeEnum1613412948344 implements MigrationInterface {
+  name = 'ServerTypeEnum1613412948344';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(
+      `CREATE TABLE "temporary_media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "media"`
+    );
+    await queryRunner.query(`DROP TABLE "media"`);
+    await queryRunner.query(`ALTER TABLE "temporary_media" RENAME TO "media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(
+      `CREATE TABLE "temporary_media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, "jellyfinMediaID" varchar, "jellyfinMediaID4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "media"`
+    );
+    await queryRunner.query(`DROP TABLE "media"`);
+    await queryRunner.query(`ALTER TABLE "temporary_media" RENAME TO "media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`ALTER TABLE "media" RENAME TO "temporary_media"`);
+    await queryRunner.query(
+      `CREATE TABLE "media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "temporary_media"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`ALTER TABLE "media" RENAME TO "temporary_media"`);
+    await queryRunner.query(
+      `CREATE TABLE "media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, "jellyfinMediaId" varchar, "jellyfinMediaId4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "temporary_media"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+  }
+}

server/migration/1613670041760-AddJellyfinDeviceId.ts

@@ -0,0 +1,123 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class AddJellyfinDeviceId1613670041760 implements MigrationInterface {
+  name = 'AddJellyfinDeviceId1613670041760';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `CREATE TABLE "temporary_user" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "email" varchar NOT NULL, "username" varchar, "plexId" integer, "plexToken" varchar, "permissions" integer NOT NULL DEFAULT (0), "avatar" varchar NOT NULL, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "password" varchar, "userType" integer NOT NULL DEFAULT (1), "plexUsername" varchar, "resetPasswordGuid" varchar, "recoveryLinkExpirationDate" date, "jellyfinUsername" varchar, "jellyfinAuthToken" varchar, CONSTRAINT "UQ_e12875dfb3b1d92d7d7c5377e22" UNIQUE ("email"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_user"("id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken") SELECT "id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken" FROM "user"`
+    );
+    await queryRunner.query(`DROP TABLE "user"`);
+    await queryRunner.query(`ALTER TABLE "temporary_user" RENAME TO "user"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(
+      `CREATE TABLE "temporary_media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "media"`
+    );
+    await queryRunner.query(`DROP TABLE "media"`);
+    await queryRunner.query(`ALTER TABLE "temporary_media" RENAME TO "media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(
+      `CREATE TABLE "temporary_user" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "email" varchar NOT NULL, "username" varchar, "plexId" integer, "plexToken" varchar, "permissions" integer NOT NULL DEFAULT (0), "avatar" varchar NOT NULL, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "password" varchar, "userType" integer NOT NULL DEFAULT (1), "plexUsername" varchar, "resetPasswordGuid" varchar, "recoveryLinkExpirationDate" date, "jellyfinUsername" varchar, "jellyfinAuthToken" varchar, "jellyfinUserId" varchar, "jellyfinDeviceId" varchar, CONSTRAINT "UQ_e12875dfb3b1d92d7d7c5377e22" UNIQUE ("email"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_user"("id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken") SELECT "id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken" FROM "user"`
+    );
+    await queryRunner.query(`DROP TABLE "user"`);
+    await queryRunner.query(`ALTER TABLE "temporary_user" RENAME TO "user"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(
+      `CREATE TABLE "temporary_media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, "jellyfinMediaId" varchar, "jellyfinMediaId4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "temporary_media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "media"`
+    );
+    await queryRunner.query(`DROP TABLE "media"`);
+    await queryRunner.query(`ALTER TABLE "temporary_media" RENAME TO "media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`ALTER TABLE "media" RENAME TO "temporary_media"`);
+    await queryRunner.query(
+      `CREATE TABLE "media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "temporary_media"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(`ALTER TABLE "user" RENAME TO "temporary_user"`);
+    await queryRunner.query(
+      `CREATE TABLE "user" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "email" varchar NOT NULL, "username" varchar, "plexId" integer, "plexToken" varchar, "permissions" integer NOT NULL DEFAULT (0), "avatar" varchar NOT NULL, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "password" varchar, "userType" integer NOT NULL DEFAULT (1), "plexUsername" varchar, "resetPasswordGuid" varchar, "recoveryLinkExpirationDate" date, "jellyfinUsername" varchar, "jellyfinAuthToken" varchar, CONSTRAINT "UQ_e12875dfb3b1d92d7d7c5377e22" UNIQUE ("email"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "user"("id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken") SELECT "id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken" FROM "temporary_user"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_user"`);
+    await queryRunner.query(`DROP INDEX "IDX_7ff2d11f6a83cb52386eaebe74"`);
+    await queryRunner.query(`DROP INDEX "IDX_41a289eb1fa489c1bc6f38d9c3"`);
+    await queryRunner.query(`DROP INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5"`);
+    await queryRunner.query(`ALTER TABLE "media" RENAME TO "temporary_media"`);
+    await queryRunner.query(
+      `CREATE TABLE "media" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "mediaType" varchar NOT NULL, "tmdbId" integer NOT NULL, "tvdbId" integer, "imdbId" varchar, "status" integer NOT NULL DEFAULT (1), "status4k" integer NOT NULL DEFAULT (1), "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "lastSeasonChange" datetime NOT NULL DEFAULT (CURRENT_TIMESTAMP), "mediaAddedAt" datetime, "serviceId" integer, "serviceId4k" integer, "externalServiceId" integer, "externalServiceId4k" integer, "externalServiceSlug" varchar, "externalServiceSlug4k" varchar, "ratingKey" varchar, "ratingKey4k" varchar, "jellyfinMediaID" varchar, "jellyfinMediaID4k" varchar, CONSTRAINT "UQ_41a289eb1fa489c1bc6f38d9c3c" UNIQUE ("tvdbId"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "media"("id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k") SELECT "id", "mediaType", "tmdbId", "tvdbId", "imdbId", "status", "status4k", "createdAt", "updatedAt", "lastSeasonChange", "mediaAddedAt", "serviceId", "serviceId4k", "externalServiceId", "externalServiceId4k", "externalServiceSlug", "externalServiceSlug4k", "ratingKey", "ratingKey4k" FROM "temporary_media"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_media"`);
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7ff2d11f6a83cb52386eaebe74" ON "media" ("imdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_41a289eb1fa489c1bc6f38d9c3" ON "media" ("tvdbId") `
+    );
+    await queryRunner.query(
+      `CREATE INDEX "IDX_7157aad07c73f6a6ae3bbd5ef5" ON "media" ("tmdbId") `
+    );
+    await queryRunner.query(`ALTER TABLE "user" RENAME TO "temporary_user"`);
+    await queryRunner.query(
+      `CREATE TABLE "user" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "email" varchar NOT NULL, "username" varchar, "plexId" integer, "plexToken" varchar, "permissions" integer NOT NULL DEFAULT (0), "avatar" varchar NOT NULL, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')), "password" varchar, "userType" integer NOT NULL DEFAULT (1), "plexUsername" varchar, "resetPasswordGuid" varchar, "recoveryLinkExpirationDate" date, "jellyfinUsername" varchar, "jellyfinId" varchar, "jellyfinAuthToken" varchar, CONSTRAINT "UQ_e12875dfb3b1d92d7d7c5377e22" UNIQUE ("email"))`
+    );
+    await queryRunner.query(
+      `INSERT INTO "user"("id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken") SELECT "id", "email", "username", "plexId", "plexToken", "permissions", "avatar", "createdAt", "updatedAt", "password", "userType", "plexUsername", "resetPasswordGuid", "recoveryLinkExpirationDate", "jellyfinUsername", "jellyfinAuthToken" FROM "temporary_user"`
+    );
+    await queryRunner.query(`DROP TABLE "temporary_user"`);
+  }
+}

server/migration/1613955393450-UpdateUserSettingsRegions.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class UpdateUserSettingsRegions1613955393450
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'UpdateUserSettingsRegions1613955393450';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1614334195680-AddTelegramSettingsToUserSettings.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddTelegramSettingsToUserSettings1614334195680
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddTelegramSettingsToUserSettings1614334195680';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1617624225464-CreateTagsFieldonMediaRequest.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class CreateTagsFieldonMediaRequest1617624225464
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'CreateTagsFieldonMediaRequest1617624225464';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1617730837489-AddUserSettingsNotificationAgentsField.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddUserSettingsNotificationAgentsField1617730837489
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddUserSettingsNotificationAgentsField1617730837489';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1618912653565-CreateUserPushSubscriptions.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class CreateUserPushSubscriptions1618912653565
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'CreateUserPushSubscriptions1618912653565';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/migration/1619339817343-AddUserSettingsNotificationTypes.ts

@@ -1,8 +1,7 @@
 import { MigrationInterface, QueryRunner } from 'typeorm';
 
 export class AddUserSettingsNotificationTypes1619339817343
-  implements MigrationInterface
-{
+  implements MigrationInterface {
   name = 'AddUserSettingsNotificationTypes1619339817343';
 
   public async up(queryRunner: QueryRunner): Promise<void> {

server/routes/auth.ts

@@ -1,6 +1,8 @@
 import { Router } from 'express';
 import { getRepository } from 'typeorm';
+import JellyfinAPI from '../api/jellyfin';
 import PlexTvAPI from '../api/plextv';
+import { MediaServerType } from '../constants/server';
 import { UserType } from '../constants/user';
 import { User } from '../entity/User';
 import { Permission } from '../lib/permissions';
@@ -29,11 +31,20 @@ authRoutes.get('/me', isAuthenticated(), async (req, res) => {
 authRoutes.post('/plex', async (req, res, next) => {
   const settings = getSettings();
   const userRepository = getRepository(User);
-  const body = req.body as { authToken?: string };
+  const body = req.body as {
+    authToken?: string;
+  };
 
   if (!body.authToken) {
     return res.status(500).json({ error: 'You must provide an auth token' });
   }
+
+  if (
+    settings.main.mediaServerType != MediaServerType.PLEX &&
+    settings.main.mediaServerType != MediaServerType.NOT_CONFIGURED
+  ) {
+    return res.status(500).json({ error: 'Plex login is disabled' });
+  }
   try {
     // First we need to use this auth token to get the users email from plex.tv
     const plextv = new PlexTvAPI(body.authToken);
@@ -82,6 +93,9 @@ authRoutes.post('/plex', async (req, res, next) => {
           userType: UserType.PLEX,
         });
         await userRepository.save(user);
+
+        //Since we created the admin user, go ahead and set the mediaservertype to PLEX
+        settings.main.mediaServerType = MediaServerType.PLEX;
       }
 
       // Double check that we didn't create the first admin user before running this
@@ -158,6 +172,168 @@ authRoutes.post('/plex', async (req, res, next) => {
   }
 });
 
+authRoutes.post('/jellyfin', async (req, res, next) => {
+  const settings = getSettings();
+  const userRepository = getRepository(User);
+  const body = req.body as {
+    username?: string;
+    password?: string;
+    hostname?: string;
+    email?: string;
+  };
+
+  //Make sure jellyfin login is enabled, but only if jellyfin is not already configured
+  if (
+    settings.main.mediaServerType !== MediaServerType.JELLYFIN &&
+    settings.jellyfin.hostname !== ''
+  ) {
+    return res.status(500).json({ error: 'Jellyfin login is disabled' });
+  } else if (!body.username || !body.password) {
+    return res
+      .status(500)
+      .json({ error: 'You must provide an username and a password' });
+  } else if (settings.jellyfin.hostname !== '' && body.hostname) {
+    return res
+      .status(500)
+      .json({ error: 'Jellyfin hostname already configured' });
+  } else if (settings.jellyfin.hostname === '' && !body.hostname) {
+    return res.status(500).json({ error: 'No hostname provided.' });
+  }
+
+  try {
+    const hostname =
+      settings.jellyfin.hostname !== ''
+        ? settings.jellyfin.hostname
+        : body.hostname;
+    // Try to find deviceId that corresponds to jellyfin user, else generate a new one
+    let user = await userRepository.findOne({
+      where: { jellyfinUsername: body.username },
+    });
+
+    let deviceId = '';
+    if (user) {
+      deviceId = user.jellyfinDeviceId ?? '';
+    } else {
+      deviceId = Buffer.from(`BOT_overseerr_${body.username ?? ''}`).toString(
+        'base64'
+      );
+    }
+    // First we need to attempt to log the user in to jellyfin
+    const jellyfinserver = new JellyfinAPI(hostname ?? '', undefined, deviceId);
+
+    const account = await jellyfinserver.login(body.username, body.password);
+    // Next let's see if the user already exists
+    user = await userRepository.findOne({
+      where: { jellyfinUserId: account.User.Id },
+    });
+
+    if (user) {
+      // Let's check if their authtoken is up to date
+      if (user.jellyfinAuthToken !== account.AccessToken) {
+        user.jellyfinAuthToken = account.AccessToken;
+      }
+
+      // Update the users avatar with their jellyfin profile pic (incase it changed)
+      if (account.User.PrimaryImageTag) {
+        user.avatar = `${hostname}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`;
+      } else {
+        user.avatar = '/os_logo_square.png';
+      }
+
+      user.jellyfinUsername = account.User.Name;
+
+      if (user.username === account.User.Name) {
+        user.username = '';
+      }
+      await userRepository.save(user);
+    } else {
+      // Here we check if it's the first user. If it is, we create the user with no check
+      // and give them admin permissions
+      const totalUsers = await userRepository.count();
+      if (totalUsers === 0) {
+        user = new User({
+          email: body.email,
+          jellyfinUsername: account.User.Name,
+          jellyfinUserId: account.User.Id,
+          jellyfinDeviceId: deviceId,
+          jellyfinAuthToken: account.AccessToken,
+          permissions: Permission.ADMIN,
+          avatar: account.User.PrimaryImageTag
+            ? `${hostname}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
+            : '/os_logo_square.png',
+          userType: UserType.JELLYFIN,
+        });
+        await userRepository.save(user);
+
+        //Update hostname in settings if it doesn't exist (initial configuration)
+        //Also set mediaservertype to JELLYFIN
+        if (settings.jellyfin.hostname === '') {
+          settings.main.mediaServerType = MediaServerType.JELLYFIN;
+          settings.jellyfin.hostname = body.hostname ?? '';
+          settings.jellyfin.serverId = account.User.ServerId;
+          settings.save();
+        }
+      }
+
+      if (!user) {
+        if (!body.email) {
+          throw new Error('add_email');
+        }
+
+        user = new User({
+          email: body.email,
+          jellyfinUsername: account.User.Name,
+          jellyfinUserId: account.User.Id,
+          jellyfinDeviceId: deviceId,
+          jellyfinAuthToken: account.AccessToken,
+          permissions: settings.main.defaultPermissions,
+          avatar: account.User.PrimaryImageTag
+            ? `${hostname}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
+            : '/os_logo_square.png',
+          userType: UserType.JELLYFIN,
+        });
+        await userRepository.save(user);
+      }
+    }
+
+    // Set logged in session
+    if (req.session) {
+      req.session.userId = user?.id;
+    }
+
+    return res.status(200).json(user?.filter() ?? {});
+  } catch (e) {
+    if (e.message === 'Unauthorized') {
+      logger.info(
+        'Failed login attempt from user with incorrect Jellyfin credentials',
+        {
+          label: 'Auth',
+          account: {
+            ip: req.ip,
+            email: body.username,
+            password: '__REDACTED__',
+          },
+        }
+      );
+      return next({
+        status: 401,
+        message: 'Unauthorized',
+      });
+    } else if (e.message === 'add_email') {
+      return next({
+        status: 406,
+        message: 'CREDENTIAL_ERROR_ADD_EMAIL',
+      });
+    } else {
+      logger.error(e.message, { label: 'Auth' });
+      return next({
+        status: 500,
+        message: 'Something went wrong.',
+      });
+    }
+  }
+});
+
 authRoutes.post('/local', async (req, res, next) => {
   const settings = getSettings();
   const userRepository = getRepository(User);

server/routes/media.ts

@@ -15,8 +15,10 @@ mediaRoutes.get('/', async (req, res, next) => {
   const pageSize = req.query.take ? Number(req.query.take) : 20;
   const skip = req.query.skip ? Number(req.query.skip) : 0;
 
-  let statusFilter: MediaStatus | FindOperator<MediaStatus> | undefined =
-    undefined;
+  let statusFilter:
+    | MediaStatus
+    | FindOperator<MediaStatus>
+    | undefined = undefined;
 
   switch (req.query.filter) {
     case 'available':

server/routes/settings/index.ts

@@ -5,6 +5,7 @@ import { merge, omit } from 'lodash';
 import path from 'path';
 import { getRepository } from 'typeorm';
 import { URL } from 'url';
+import JellyfinAPI from '../../api/jellyfin';
 import PlexAPI from '../../api/plexapi';
 import PlexTvAPI from '../../api/plextv';
 import Media from '../../entity/Media';
@@ -16,11 +17,12 @@ import {
   LogsResultsResponse,
   SettingsAboutResponse,
 } from '../../interfaces/api/settingsInterfaces';
+import { jobJellyfinFullSync } from '../../job/jellyfinsync';
 import { scheduledJobs } from '../../job/schedule';
 import cacheManager, { AvailableCacheIds } from '../../lib/cache';
 import { Permission } from '../../lib/permissions';
 import { plexFullScanner } from '../../lib/scanners/plex';
-import { getSettings, MainSettings } from '../../lib/settings';
+import { getSettings, Library, MainSettings } from '../../lib/settings';
 import logger from '../../logger';
 import { isAuthenticated } from '../../middleware/auth';
 import { getAppVersion } from '../../utils/appVersion';
@@ -224,6 +226,79 @@ settingsRoutes.post('/plex/sync', (req, res) => {
   return res.status(200).json(plexFullScanner.status());
 });
 
+settingsRoutes.get('/jellyfin', (_req, res) => {
+  const settings = getSettings();
+
+  res.status(200).json(settings.jellyfin);
+});
+
+settingsRoutes.post('/jellyfin', (req, res) => {
+  const settings = getSettings();
+
+  settings.jellyfin = merge(settings.jellyfin, req.body);
+  settings.save();
+
+  return res.status(200).json(settings.jellyfin);
+});
+
+settingsRoutes.get('/jellyfin/library', async (req, res) => {
+  const settings = getSettings();
+
+  if (req.query.sync) {
+    const userRepository = getRepository(User);
+    const admin = await userRepository.findOneOrFail({
+      select: ['id', 'jellyfinAuthToken', 'jellyfinDeviceId', 'jellyfinUserId'],
+      order: { id: 'ASC' },
+    });
+    const jellyfinClient = new JellyfinAPI(
+      settings.jellyfin.hostname ?? '',
+      admin.jellyfinAuthToken ?? '',
+      admin.jellyfinDeviceId ?? ''
+    );
+
+    jellyfinClient.setUserId(admin.jellyfinUserId ?? '');
+
+    const libraries = await jellyfinClient.getLibraries();
+
+    const newLibraries: Library[] = libraries.map((library) => {
+      const existing = settings.jellyfin.libraries.find(
+        (l) => l.id === library.key && l.name === library.title
+      );
+
+      return {
+        id: library.key,
+        name: library.title,
+        enabled: existing?.enabled ?? false,
+        type: library.type,
+      };
+    });
+
+    settings.jellyfin.libraries = newLibraries;
+  }
+
+  const enabledLibraries = req.query.enable
+    ? (req.query.enable as string).split(',')
+    : [];
+  settings.jellyfin.libraries = settings.jellyfin.libraries.map((library) => ({
+    ...library,
+    enabled: enabledLibraries.includes(library.id),
+  }));
+  settings.save();
+  return res.status(200).json(settings.jellyfin.libraries);
+});
+
+settingsRoutes.get('/jellyfin/sync', (_req, res) => {
+  return res.status(200).json(jobJellyfinFullSync.status());
+});
+
+settingsRoutes.post('/jellyfin/sync', (req, res) => {
+  if (req.body.cancel) {
+    jobJellyfinFullSync.cancel();
+  } else if (req.body.start) {
+    jobJellyfinFullSync.run();
+  }
+  return res.status(200).json(jobJellyfinFullSync.status());
+});
 settingsRoutes.get(
   '/logs',
   rateLimit({ windowMs: 60 * 1000, max: 50 }),

server/utils/asyncLock.ts

@@ -40,7 +40,7 @@ class AsyncLock {
   public dispatch = async (
     key: string | number,
     callback: () => Promise<void>
-  ) => {
+  ): Promise<void> => {
     const skey = String(key);
     await this.acquire(skey);
     try {

src/assets/services/jellyfin.svg

@@ -0,0 +1,24 @@
+<svg id="banner-dark" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1536 512">
+    <defs>
+        <linearGradient id="linear-gradient" x1="110.25" y1="213.3" x2="496.14" y2="436.09" gradientUnits="userSpaceOnUse">
+            <stop offset="0" stop-color="#aa5cc3"/>
+            <stop offset="1" stop-color="#00a4dc"/>
+        </linearGradient>
+    </defs>
+    <title>banner-dark</title>
+    <g id="banner-dark">
+        <g id="banner-dark-icon">
+            <path id="inner-shape" d="M261.42,201.62c-20.44,0-86.24,119.29-76.2,139.43s142.48,19.92,152.4,0S281.86,201.63,261.42,201.62Z" fill="url(#linear-gradient)"/>
+            <path id="outer-shape" d="M261.42,23.3C199.83,23.3,1.57,382.73,31.8,443.43s429.34,60,459.24,0S323,23.3,261.42,23.3ZM411.9,390.76c-19.59,39.33-281.08,39.77-300.9,0S221.1,115.48,261.45,115.48,431.49,351.42,411.9,390.76Z" fill="url(#linear-gradient)"/>
+        </g>
+        <g id="jellyfin-light-outlines" style="isolation:isolate" transform="translate(43.8)">
+            <path d="M556.64,350.75a67,67,0,0,1-22.87-27.47,8.91,8.91,0,0,1-1.49-4.75,7.42,7.42,0,0,1,2.83-5.94,9.25,9.25,0,0,1,6.09-2.38c3.16,0,5.94,1.69,8.31,5.05a48.09,48.09,0,0,0,16.34,20.34,40.59,40.59,0,0,0,24,7.58q20.51,0,33.27-12.62t12.77-33.12V159a8.44,8.44,0,0,1,2.67-6.39,9.56,9.56,0,0,1,6.83-2.52,9,9,0,0,1,6.68,2.52,8.7,8.7,0,0,1,2.53,6.39v138.4a64.7,64.7,0,0,1-8.32,32.67,59,59,0,0,1-23,22.72Q608.62,361,589.9,361A57.21,57.21,0,0,1,556.64,350.75Z" fill="#fff"/>
+            <path d="M831.66,279.47a8.77,8.77,0,0,1-6.24,2.53H713.16q0,17.82,7.27,31.92a54.91,54.91,0,0,0,20.79,22.28q13.51,8.18,31.93,8.17a54,54,0,0,0,25.54-5.94,52.7,52.7,0,0,0,18.12-15.15,10,10,0,0,1,6.24-2.67,8.14,8.14,0,0,1,7.72,7.72,8.81,8.81,0,0,1-3,6.24,74.7,74.7,0,0,1-23.91,19A65.56,65.56,0,0,1,773.45,361q-22.87,0-40.4-9.8a69.51,69.51,0,0,1-27.32-27.48q-9.79-17.66-9.8-40.83,0-24.36,9.65-42.62t25.69-27.92a65.2,65.2,0,0,1,34.16-9.65A70,70,0,0,1,798.84,211a65.78,65.78,0,0,1,25.39,24.36q9.81,16,10.1,38A8.07,8.07,0,0,1,831.66,279.47ZM733.5,231.8Q718.8,243.68,714.64,266H815.92v-2.38A46.91,46.91,0,0,0,807,240.27a48.47,48.47,0,0,0-18.56-15.15,54,54,0,0,0-23-5.2Q748.2,219.92,733.5,231.8Z" fill="#fff"/>
+            <path d="M888.24,355.5a8.92,8.92,0,0,1-15.3-6.38v-202a8.91,8.91,0,1,1,17.82,0v202A8.65,8.65,0,0,1,888.24,355.5Z" fill="#fff"/>
+            <path d="M956.55,355.5a8.92,8.92,0,0,1-15.3-6.38v-202a8.91,8.91,0,1,1,17.82,0v202A8.65,8.65,0,0,1,956.55,355.5Z" fill="#fff"/>
+            <path d="M1122.86,206.11a8.7,8.7,0,0,1,2.53,6.39v131q0,23.44-9.21,40.09a61.58,61.58,0,0,1-25.54,25.25q-16.34,8.61-36.83,8.61a96.73,96.73,0,0,1-23.31-2.68,61.72,61.72,0,0,1-18-7.12q-6.24-3.87-6.24-8.62a17.94,17.94,0,0,1,.6-3,8.06,8.06,0,0,1,3-4.45,7.49,7.49,0,0,1,4.45-1.49,7.91,7.91,0,0,1,3.56.89q19,10.39,36.24,10.4,24.65,0,39.06-15.44t14.4-42.18V333.38a54.37,54.37,0,0,1-21.38,20,62.55,62.55,0,0,1-30.3,7.58q-25.83,0-39.2-15.45t-13.37-41.87V212.5a8.91,8.91,0,1,1,17.82,0V301q0,21.39,9.36,32.38t29.25,11a48,48,0,0,0,23.32-6.09,49.88,49.88,0,0,0,17.82-16,37.44,37.44,0,0,0,6.68-21.24V212.5a9,9,0,0,1,15.29-6.39Z" fill="#fff"/>
+            <path d="M1210.18,161.41q-5.21,6.24-5.2,17.23v30.59h33.27a8.19,8.19,0,0,1,5.79,2.38,8.26,8.26,0,0,1,0,11.88,8.22,8.22,0,0,1-5.79,2.37H1205V349.12a8.91,8.91,0,1,1-17.82,0V225.86h-21.68a7.83,7.83,0,0,1-5.94-2.52,8.21,8.21,0,0,1-2.37-5.79,8,8,0,0,1,2.37-6.09,8.33,8.33,0,0,1,5.94-2.23h21.68V178.64q0-18.7,10.84-29t29-10.24a46.1,46.1,0,0,1,15.45,2.52q7.13,2.53,7.12,8.17a8.07,8.07,0,0,1-2.37,5.94,7.37,7.37,0,0,1-5.35,2.37,18.81,18.81,0,0,1-6.53-1.48,42,42,0,0,0-10.4-1.78Q1215.37,155.18,1210.18,161.41ZM1276,180.87c-2.19-1.88-3.27-4.61-3.27-8.17v-3q0-5.34,3.41-8.17t9.36-2.82q11.88,0,11.88,11v3c0,3.56-1,6.29-3.12,8.17s-5.1,2.82-9.06,2.82S1278.14,182.75,1276,180.87Zm15.59,174.63a8.92,8.92,0,0,1-15.3-6.38V212.5a8.91,8.91,0,1,1,17.82,0V349.12A8.65,8.65,0,0,1,1291.56,355.5Z" fill="#fff"/>
+            <path d="M1452.53,218.88q12.92,16.2,12.92,42.92v87.32a8.4,8.4,0,0,1-2.67,6.38,8.8,8.8,0,0,1-6.24,2.53,8.64,8.64,0,0,1-8.91-8.91V262.69q0-19.31-9.65-31.33t-29.85-12a53.28,53.28,0,0,0-42.77,21.83,36.24,36.24,0,0,0-7.13,21.53v86.43a8.91,8.91,0,1,1-17.82,0V216.06a8.91,8.91,0,1,1,17.82,0V232.4q8-12.77,23-21.24A61.84,61.84,0,0,1,1412,202.7Q1439.61,202.7,1452.53,218.88Z" fill="#fff"/>
+        </g>
+    </g>
+</svg>

src/components/Common/Accordion/index.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react';
 import AnimateHeight from 'react-animate-height';
 
 export interface AccordionProps {
-  children: (args: AccordionChildProps) => React.ReactElement<any, any> | null;
+  children: (args: AccordionChildProps) => React.ReactElement | null;
   /** If true, only one accordion item can be open at any time */
   single?: boolean;
   /** If true, at least one accordion item will always be open */
@@ -13,7 +13,7 @@ export interface AccordionProps {
 export interface AccordionChildProps {
   openIndexes: number[];
   handleClick(index: number): void;
-  AccordionContent: any;
+  AccordionContent: typeof AccordionContent;
 }
 
 export const AccordionContent: React.FC<{ isOpen: boolean }> = ({

src/components/ExternalLinkBlock/index.tsx

@@ -1,11 +1,14 @@
 import React from 'react';
 import { MediaType } from '../../../server/constants/media';
+import { MediaServerType } from '../../../server/constants/server';
 import ImdbLogo from '../../assets/services/imdb.svg';
+import JellyfinLogo from '../../assets/services/jellyfin.svg';
 import PlexLogo from '../../assets/services/plex.svg';
 import RTLogo from '../../assets/services/rt.svg';
 import TmdbLogo from '../../assets/services/tmdb.svg';
 import TvdbLogo from '../../assets/services/tvdb.svg';
 import useLocale from '../../hooks/useLocale';
+import useSettings from '../../hooks/useSettings';
 
 interface ExternalLinkBlockProps {
   mediaType: 'movie' | 'tv';
@@ -13,7 +16,7 @@ interface ExternalLinkBlockProps {
   tvdbId?: number;
   imdbId?: string;
   rtUrl?: string;
-  plexUrl?: string;
+  mediaUrl?: string;
 }
 
 const ExternalLinkBlock: React.FC<ExternalLinkBlockProps> = ({
@@ -22,20 +25,29 @@ const ExternalLinkBlock: React.FC<ExternalLinkBlockProps> = ({
   tvdbId,
   imdbId,
   rtUrl,
-  plexUrl,
+  mediaUrl,
 }) => {
+  const settings = useSettings();
   const { locale } = useLocale();
 
   return (
-    <div className="flex items-center justify-center w-full space-x-5">
-      {plexUrl && (
+    <div className="flex items-center justify-end">
+      {mediaUrl && (
         <a
-          href={plexUrl}
-          className="w-12 transition duration-300 opacity-50 hover:opacity-100"
+          href={mediaUrl}
+          className={`${
+            settings.currentSettings.mediaServerType === MediaServerType.PLEX
+              ? 'w-8'
+              : 'w-14'
+          } mx-2 transition duration-300 opacity-50 hover:opacity-100`}
           target="_blank"
           rel="noreferrer"
         >
-          <PlexLogo />
+          {settings.currentSettings.mediaServerType === MediaServerType.PLEX ? (
+            <PlexLogo />
+          ) : (
+            <JellyfinLogo />
+          )}
         </a>
       )}
       {tmdbId && (

src/components/Login/AddEmailModal.tsx

@@ -0,0 +1,114 @@
+import React from 'react';
+import Transition from '../Transition';
+import Modal from '../Common/Modal';
+import { Formik, Field } from 'formik';
+import * as Yup from 'yup';
+import axios from 'axios';
+import { defineMessages, useIntl } from 'react-intl';
+import useSettings from '../../hooks/useSettings';
+
+const messages = defineMessages({
+  title: 'Add Email',
+  description:
+    'Since this is your first time logging into {applicationName}, you are required to add a valid email address.',
+  email: 'Email address',
+  validationEmailRequired: 'You must provide an email',
+  validationEmailFormat: 'Invalid email',
+  saving: 'Adding…',
+  save: 'Add',
+});
+
+interface AddEmailModalProps {
+  username: string;
+  password: string;
+  onClose: () => void;
+  onSave: () => void;
+}
+
+const AddEmailModal: React.FC<AddEmailModalProps> = ({
+  onClose,
+  username,
+  password,
+  onSave,
+}) => {
+  const intl = useIntl();
+  const settings = useSettings();
+
+  const EmailSettingsSchema = Yup.object().shape({
+    email: Yup.string()
+      .email(intl.formatMessage(messages.validationEmailFormat))
+      .required(intl.formatMessage(messages.validationEmailRequired)),
+  });
+
+  return (
+    <Transition
+      appear
+      show
+      enter="transition ease-in-out duration-300 transform opacity-0"
+      enterFrom="opacity-0"
+      enterTo="opacuty-100"
+      leave="transition ease-in-out duration-300 transform opacity-100"
+      leaveFrom="opacity-100"
+      leaveTo="opacity-0"
+    >
+      <Formik
+        initialValues={{
+          email: '',
+        }}
+        validationSchema={EmailSettingsSchema}
+        onSubmit={async (values) => {
+          try {
+            await axios.post('/api/v1/auth/jellyfin', {
+              username: username,
+              password: password,
+              email: values.email,
+            });
+
+            onSave();
+          } catch (e) {
+            // set error here
+          }
+        }}
+      >
+        {({ errors, touched, handleSubmit, isSubmitting, isValid }) => {
+          return (
+            <Modal
+              onCancel={onClose}
+              okButtonType="primary"
+              okText={
+                isSubmitting
+                  ? intl.formatMessage(messages.saving)
+                  : intl.formatMessage(messages.save)
+              }
+              okDisabled={isSubmitting || !isValid}
+              onOk={() => handleSubmit()}
+              title={intl.formatMessage(messages.title)}
+            >
+              {intl.formatMessage(messages.description, {
+                applicationName: settings.currentSettings.applicationTitle,
+              })}
+              <label htmlFor="email" className="text-label">
+                {intl.formatMessage(messages.email)}
+              </label>
+              <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                <div className="flex rounded-md shadow-sm">
+                  <Field
+                    id="email"
+                    name="email"
+                    type="text"
+                    placeholder={intl.formatMessage(messages.email)}
+                  />
+                </div>
+                {errors.email && touched.email && (
+                  <div className="error">{errors.email}</div>
+                )}
+              </div>
+            </Modal>
+          );
+        }}
+      </Formik>
+    </Transition>
+  );
+};
+
+export default AddEmailModal;

src/components/Login/JellyfinLogin.tsx

@@ -0,0 +1,313 @@
+import React, { useState } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+import Button from '../Common/Button';
+
+import { Field, Form, Formik } from 'formik';
+import * as Yup from 'yup';
+import axios from 'axios';
+import { useToasts } from 'react-toast-notifications';
+import useSettings from '../../hooks/useSettings';
+import AddEmailModal from './AddEmailModal';
+
+const messages = defineMessages({
+  username: 'Username',
+  password: 'Password',
+  host: 'Jellyfin URL',
+  email: 'Email',
+  validationhostrequired: 'Jellyfin URL required',
+  validationhostformat: 'Valid URL required',
+  validationemailrequired: 'Email required',
+  validationemailformat: 'Valid email required',
+  validationusernamerequired: 'Username required',
+  validationpasswordrequired: 'Password required',
+  loginerror: 'Something went wrong while trying to sign in.',
+  credentialerror: 'The username or password is incorrect.',
+  signingin: 'Signing in…',
+  signin: 'Sign In',
+  initialsigningin: 'Connecting…',
+  initialsignin: 'Connect',
+  forgotpassword: 'Forgot Password?',
+});
+
+interface JellyfinLoginProps {
+  revalidate: () => void;
+  initial?: boolean;
+}
+
+const JellyfinLogin: React.FC<JellyfinLoginProps> = ({
+  revalidate,
+  initial,
+}) => {
+  const [requiresEmail, setRequiresEmail] = useState<number>(0);
+  const [username, setUsername] = useState<string>();
+  const [password, setPassword] = useState<string>();
+  const toasts = useToasts();
+  const intl = useIntl();
+  const settings = useSettings();
+
+  if (initial) {
+    const LoginSchema = Yup.object().shape({
+      host: Yup.string()
+        .url(intl.formatMessage(messages.validationhostformat))
+        .required(intl.formatMessage(messages.validationhostrequired)),
+      email: Yup.string()
+        .email(intl.formatMessage(messages.validationemailformat))
+        .required(intl.formatMessage(messages.validationemailrequired)),
+      username: Yup.string().required(
+        intl.formatMessage(messages.validationusernamerequired)
+      ),
+      password: Yup.string().required(
+        intl.formatMessage(messages.validationpasswordrequired)
+      ),
+    });
+    return (
+      <Formik
+        initialValues={{
+          username: '',
+          password: '',
+          host: '',
+          email: '',
+        }}
+        validationSchema={LoginSchema}
+        onSubmit={async (values) => {
+          try {
+            await axios.post('/api/v1/auth/jellyfin', {
+              username: values.username,
+              password: values.password,
+              hostname: values.host,
+              email: values.email,
+            });
+          } catch (e) {
+            toasts.addToast(
+              intl.formatMessage(
+                e.message == 'Request failed with status code 401'
+                  ? messages.credentialerror
+                  : messages.loginerror
+              ),
+              {
+                autoDismiss: true,
+                appearance: 'error',
+              }
+            );
+          } finally {
+            revalidate();
+          }
+        }}
+      >
+        {({ errors, touched, isSubmitting, isValid }) => (
+          <Form>
+            <div className="sm:border-t sm:border-gray-800">
+              <label htmlFor="host" className="text-label">
+                {intl.formatMessage(messages.host)}
+              </label>
+              <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                <div className="flex rounded-md shadow-sm">
+                  <Field
+                    id="host"
+                    name="host"
+                    type="text"
+                    placeholder={intl.formatMessage(messages.host)}
+                  />
+                </div>
+                {errors.host && touched.host && (
+                  <div className="error">{errors.host}</div>
+                )}
+              </div>
+              <label htmlFor="email" className="text-label">
+                {intl.formatMessage(messages.email)}
+              </label>
+              <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                <div className="flex rounded-md shadow-sm">
+                  <Field
+                    id="email"
+                    name="email"
+                    type="text"
+                    placeholder={intl.formatMessage(messages.email)}
+                  />
+                </div>
+                {errors.email && touched.email && (
+                  <div className="error">{errors.email}</div>
+                )}
+              </div>
+              <label htmlFor="username" className="text-label">
+                {intl.formatMessage(messages.username)}
+              </label>
+              <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                <div className="flex rounded-md shadow-sm">
+                  <Field
+                    id="username"
+                    name="username"
+                    type="text"
+                    placeholder={intl.formatMessage(messages.username)}
+                  />
+                </div>
+                {errors.username && touched.username && (
+                  <div className="error">{errors.username}</div>
+                )}
+              </div>
+              <label htmlFor="password" className="text-label">
+                {intl.formatMessage(messages.password)}
+              </label>
+              <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                <div className="shadow-sm flexrounded-md">
+                  <Field
+                    id="password"
+                    name="password"
+                    type="password"
+                    placeholder={intl.formatMessage(messages.password)}
+                  />
+                </div>
+                {errors.password && touched.password && (
+                  <div className="error">{errors.password}</div>
+                )}
+              </div>
+            </div>
+            <div className="pt-5 mt-8 border-t border-gray-700">
+              <div className="flex justify-end">
+                <span className="inline-flex rounded-md shadow-sm">
+                  <Button
+                    buttonType="primary"
+                    type="submit"
+                    disabled={isSubmitting || !isValid}
+                  >
+                    {isSubmitting
+                      ? intl.formatMessage(messages.signingin)
+                      : intl.formatMessage(messages.signin)}
+                  </Button>
+                </span>
+              </div>
+            </div>
+          </Form>
+        )}
+      </Formik>
+    );
+  } else {
+    const LoginSchema = Yup.object().shape({
+      username: Yup.string().required(
+        intl.formatMessage(messages.validationusernamerequired)
+      ),
+      password: Yup.string().required(
+        intl.formatMessage(messages.validationpasswordrequired)
+      ),
+    });
+    return (
+      <div>
+        {requiresEmail == 1 && (
+          <AddEmailModal
+            username={username ?? ''}
+            password={password ?? ''}
+            onSave={revalidate}
+            onClose={() => setRequiresEmail(0)}
+          ></AddEmailModal>
+        )}
+        <Formik
+          initialValues={{
+            username: '',
+            password: '',
+          }}
+          validationSchema={LoginSchema}
+          onSubmit={async (values) => {
+            try {
+              await axios.post('/api/v1/auth/jellyfin', {
+                username: values.username,
+                password: values.password,
+              });
+            } catch (e) {
+              if (e.message === 'Request failed with status code 406') {
+                setUsername(values.username);
+                setPassword(values.password);
+                setRequiresEmail(1);
+              } else {
+                toasts.addToast(
+                  intl.formatMessage(
+                    e.message == 'Request failed with status code 401'
+                      ? messages.credentialerror
+                      : messages.loginerror
+                  ),
+                  {
+                    autoDismiss: true,
+                    appearance: 'error',
+                  }
+                );
+              }
+            } finally {
+              revalidate();
+            }
+          }}
+        >
+          {({ errors, touched, isSubmitting, isValid }) => {
+            return (
+              <>
+                <Form>
+                  <div className="sm:border-t sm:border-gray-800">
+                    <label htmlFor="username" className="text-label">
+                      {intl.formatMessage(messages.username)}
+                    </label>
+                    <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                      <div className="flex max-w-lg rounded-md shadow-sm">
+                        <Field
+                          id="username"
+                          name="username"
+                          type="text"
+                          placeholder={intl.formatMessage(messages.username)}
+                        />
+                      </div>
+                      {errors.username && touched.username && (
+                        <div className="error">{errors.username}</div>
+                      )}
+                    </div>
+                    <label htmlFor="password" className="text-label">
+                      {intl.formatMessage(messages.password)}
+                    </label>
+                    <div className="mt-1 mb-2 sm:mt-0 sm:col-span-2">
+                      <div className="flex max-w-lg rounded-md shadow-sm">
+                        <Field
+                          id="password"
+                          name="password"
+                          type="password"
+                          placeholder={intl.formatMessage(messages.password)}
+                        />
+                      </div>
+                      {errors.password && touched.password && (
+                        <div className="error">{errors.password}</div>
+                      )}
+                    </div>
+                  </div>
+                  <div className="pt-5 mt-8 border-t border-gray-700">
+                    <div className="flex justify-between">
+                      <span className="inline-flex rounded-md shadow-sm">
+                        <Button
+                          as="a"
+                          buttonType="ghost"
+                          href={
+                            settings.currentSettings.jellyfinHost +
+                            '/web/#!/forgotpassword.html'
+                          }
+                        >
+                          {intl.formatMessage(messages.forgotpassword)}
+                        </Button>
+                      </span>
+                      <span className="inline-flex rounded-md shadow-sm">
+                        <Button
+                          buttonType="primary"
+                          type="submit"
+                          disabled={isSubmitting || !isValid}
+                        >
+                          {isSubmitting
+                            ? intl.formatMessage(messages.signingin)
+                            : intl.formatMessage(messages.signin)}
+                        </Button>
+                      </span>
+                    </div>
+                  </div>
+                </Form>
+              </>
+            );
+          }}
+        </Formik>
+      </div>
+    );
+  }
+};
+
+export default JellyfinLogin;

src/components/Login/index.tsx

@@ -3,6 +3,7 @@ import axios from 'axios';
 import { useRouter } from 'next/dist/client/router';
 import React, { useEffect, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
+import { MediaServerType } from '../../../server/constants/server';
 import useSettings from '../../hooks/useSettings';
 import { useUser } from '../../hooks/useUser';
 import Accordion from '../Common/Accordion';
@@ -11,12 +12,14 @@ import PageTitle from '../Common/PageTitle';
 import LanguagePicker from '../Layout/LanguagePicker';
 import PlexLoginButton from '../PlexLoginButton';
 import Transition from '../Transition';
+import JellyfinLogin from './JellyfinLogin';
 import LocalLogin from './LocalLogin';
 
 const messages = defineMessages({
   signin: 'Sign In',
   signinheader: 'Sign in to continue',
   signinwithplex: 'Use your Plex account',
+  signinwithjellyfin: 'Use your Jellyfin account',
   signinwithoverseerr: 'Use your {applicationTitle} account',
 });
 
@@ -124,14 +127,22 @@ const Login: React.FC = () => {
                     onClick={() => handleClick(0)}
                     disabled={!settings.currentSettings.localLogin}
                   >
-                    {intl.formatMessage(messages.signinwithplex)}
+                    {settings.currentSettings.mediaServerType ==
+                    MediaServerType.PLEX
+                      ? intl.formatMessage(messages.signinwithplex)
+                      : intl.formatMessage(messages.signinwithjellyfin)}
                   </button>
                   <AccordionContent isOpen={openIndexes.includes(0)}>
                     <div className="px-10 py-8">
-                      <PlexLoginButton
-                        isProcessing={isProcessing}
-                        onAuthToken={(authToken) => setAuthToken(authToken)}
-                      />
+                      {settings.currentSettings.mediaServerType ==
+                      MediaServerType.PLEX ? (
+                        <PlexLoginButton
+                          isProcessing={isProcessing}
+                          onAuthToken={(authToken) => setAuthToken(authToken)}
+                        />
+                      ) : (
+                        <JellyfinLogin revalidate={revalidate} />
+                      )}
                     </div>
                   </AccordionContent>
                   {settings.currentSettings.localLogin && (

src/components/MovieDetails/index.tsx

@@ -19,6 +19,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
 import type { RTRating } from '../../../server/api/rottentomatoes';
 import { MediaStatus } from '../../../server/constants/media';
+import { MediaServerType } from '../../../server/constants/server';
 import type { MovieDetails as MovieDetailsType } from '../../../server/models/Movie';
 import RTAudFresh from '../../assets/rt_aud_fresh.svg';
 import RTAudRotten from '../../assets/rt_aud_rotten.svg';
@@ -71,8 +72,8 @@ const messages = defineMessages({
   openradarr: 'Open Movie in Radarr',
   openradarr4k: 'Open Movie in 4K Radarr',
   downloadstatus: 'Download Status',
-  playonplex: 'Play on Plex',
-  play4konplex: 'Play in 4K on Plex',
+  play: 'Play on {mediaServerName}',
+  play4k: 'Play 4K on {mediaServerName}',
   markavailable: 'Mark as Available',
   mark4kavailable: 'Mark as Available in 4K',
   showmore: 'Show More',
@@ -121,28 +122,29 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
   const showAllStudios = data.productionCompanies.length <= minStudios + 1;
   const mediaLinks: PlayButtonLink[] = [];
 
-  if (
-    data.mediaInfo?.plexUrl &&
-    hasPermission([Permission.REQUEST, Permission.REQUEST_MOVIE], {
-      type: 'or',
-    })
-  ) {
+  if (data.mediaInfo?.mediaUrl) {
     mediaLinks.push({
-      text: intl.formatMessage(messages.playonplex),
-      url: data.mediaInfo?.plexUrl,
+      text:
+        settings.currentSettings.mediaServerType === MediaServerType.JELLYFIN
+          ? intl.formatMessage(messages.play, { mediaServerName: 'Jellyfin' })
+          : intl.formatMessage(messages.play, { mediaServerName: 'Plex' }),
+      url: data.mediaInfo?.mediaUrl,
       svg: <PlayIcon />,
     });
   }
 
   if (
-    data.mediaInfo?.plexUrl4k &&
-    hasPermission([Permission.REQUEST_4K, Permission.REQUEST_4K_MOVIE], {
+    data.mediaInfo?.mediaUrl4k &&
+    hasPermission([Permission.REQUEST_4K, Permission.REQUEST_4K_TV], {
       type: 'or',
     })
   ) {
     mediaLinks.push({
-      text: intl.formatMessage(messages.play4konplex),
-      url: data.mediaInfo?.plexUrl4k,
+      text:
+        settings.currentSettings.mediaServerType === MediaServerType.JELLYFIN
+          ? intl.formatMessage(messages.play4k, { mediaServerName: 'Jellyfin' })
+          : intl.formatMessage(messages.play4k, { mediaServerName: 'Plex' }),
+      url: data.mediaInfo?.mediaUrl4k,
       svg: <PlayIcon />,
     });
   }
@@ -406,7 +408,7 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
             <StatusBadge
               status={data.mediaInfo?.status}
               inProgress={(data.mediaInfo?.downloadStatus ?? []).length > 0}
-              plexUrl={data.mediaInfo?.plexUrl}
+              mediaUrl={data.mediaInfo?.mediaUrl}
             />
             {settings.currentSettings.movie4kEnabled &&
               hasPermission(
@@ -421,7 +423,7 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
                   inProgress={
                     (data.mediaInfo?.downloadStatus4k ?? []).length > 0
                   }
-                  plexUrl4k={data.mediaInfo?.plexUrl4k}
+                  mediaUrl4k={data.mediaInfo?.mediaUrl4k}
                 />
               )}
           </div>
@@ -701,7 +703,9 @@ const MovieDetails: React.FC<MovieDetailsProps> = ({ movie }) => {
                 tvdbId={data.externalIds.tvdbId}
                 imdbId={data.externalIds.imdbId}
                 rtUrl={ratingData?.url}
-                plexUrl={data.mediaInfo?.plexUrl ?? data.mediaInfo?.plexUrl4k}
+                mediaUrl={
+                  data.mediaInfo?.mediaUrl ?? data.mediaInfo?.mediaUrl4k
+                }
               />
             </div>
           </div>

src/components/RequestCard/index.tsx

@@ -1,38 +1,24 @@
-import {
-  CheckIcon,
-  PencilIcon,
-  RefreshIcon,
-  TrashIcon,
-  XIcon,
-} from '@heroicons/react/solid';
-import axios from 'axios';
-import Link from 'next/link';
-import React, { useEffect, useState } from 'react';
+import React, { useContext, useEffect } from 'react';
 import { useInView } from 'react-intersection-observer';
-import { defineMessages, useIntl } from 'react-intl';
-import { useToasts } from 'react-toast-notifications';
-import useSWR, { mutate } from 'swr';
-import {
-  MediaRequestStatus,
-  MediaStatus,
-} from '../../../server/constants/media';
 import type { MediaRequest } from '../../../server/entity/MediaRequest';
-import type { MovieDetails } from '../../../server/models/Movie';
 import type { TvDetails } from '../../../server/models/Tv';
-import { Permission, useUser } from '../../hooks/useUser';
-import globalMessages from '../../i18n/globalMessages';
-import { withProperties } from '../../utils/typeHelpers';
+import type { MovieDetails } from '../../../server/models/Movie';
+import useSWR from 'swr';
+import { LanguageContext } from '../../context/LanguageContext';
+import { MediaRequestStatus } from '../../../server/constants/media';
 import Badge from '../Common/Badge';
+import { useUser, Permission } from '../../hooks/useUser';
+import axios from 'axios';
 import Button from '../Common/Button';
-import CachedImage from '../Common/CachedImage';
-import RequestModal from '../RequestModal';
+import { withProperties } from '../../utils/typeHelpers';
+import Link from 'next/link';
+import { defineMessages, useIntl } from 'react-intl';
+import globalMessages from '../../i18n/globalMessages';
 import StatusBadge from '../StatusBadge';
 
 const messages = defineMessages({
-  seasons: '{seasonCount, plural, one {Season} other {Seasons}}',
-  failedretry: 'Something went wrong while retrying the request.',
-  mediaerror: 'The associated title for this request is no longer available.',
-  deleterequest: 'Delete Request',
+  seasons: 'Seasons',
+  all: 'All',
 });
 
 const isMovie = (movie: MovieDetails | TvDetails): movie is MovieDetails => {
@@ -41,7 +27,7 @@ const isMovie = (movie: MovieDetails | TvDetails): movie is MovieDetails => {
 
 const RequestCardPlaceholder: React.FC = () => {
   return (
-    <div className="relative p-4 bg-gray-700 rounded-xl w-72 sm:w-96 animate-pulse">
+    <div className="relative p-4 bg-gray-700 rounded-lg w-72 sm:w-96 animate-pulse">
       <div className="w-20 sm:w-28">
         <div className="w-full" style={{ paddingBottom: '150%' }} />
       </div>
@@ -49,45 +35,6 @@ const RequestCardPlaceholder: React.FC = () => {
   );
 };
 
-interface RequestCardErrorProps {
-  mediaId?: number;
-}
-
-const RequestCardError: React.FC<RequestCardErrorProps> = ({ mediaId }) => {
-  const { hasPermission } = useUser();
-  const intl = useIntl();
-
-  const deleteRequest = async () => {
-    await axios.delete(`/api/v1/media/${mediaId}`);
-    mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');
-  };
-
-  return (
-    <div className="relative p-4 bg-gray-800 ring-1 ring-red-500 rounded-xl w-72 sm:w-96">
-      <div className="w-20 sm:w-28">
-        <div className="w-full" style={{ paddingBottom: '150%' }}>
-          <div className="absolute inset-0 flex flex-col items-center justify-center w-full h-full px-10">
-            <div className="w-full text-xs text-center text-gray-300 whitespace-normal sm:text-sm">
-              {intl.formatMessage(messages.mediaerror)}
-            </div>
-            {hasPermission(Permission.MANAGE_REQUESTS) && mediaId && (
-              <Button
-                buttonType="danger"
-                buttonSize="sm"
-                className="mt-4"
-                onClick={() => deleteRequest()}
-              >
-                <TrashIcon />
-                <span>{intl.formatMessage(messages.deleterequest)}</span>
-              </Button>
-            )}
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};
-
 interface RequestCardProps {
   request: MediaRequest;
   onTitleData?: (requestId: number, title: MovieDetails | TvDetails) => void;
@@ -98,16 +45,14 @@ const RequestCard: React.FC<RequestCardProps> = ({ request, onTitleData }) => {
     triggerOnce: true,
   });
   const intl = useIntl();
-  const { user, hasPermission } = useUser();
-  const { addToast } = useToasts();
-  const [isRetrying, setRetrying] = useState(false);
-  const [showEditModal, setShowEditModal] = useState(false);
+  const { hasPermission } = useUser();
+  const { locale } = useContext(LanguageContext);
   const url =
     request.type === 'movie'
       ? `/api/v1/movie/${request.media.tmdbId}`
       : `/api/v1/tv/${request.media.tmdbId}`;
   const { data: title, error } = useSWR<MovieDetails | TvDetails>(
-    inView ? `${url}` : null
+    inView ? `${url}?language=${locale}` : null
   );
   const {
     data: requestData,
@@ -125,30 +70,6 @@ const RequestCard: React.FC<RequestCardProps> = ({ request, onTitleData }) => {
     }
   };
 
-  const deleteRequest = async () => {
-    await axios.delete(`/api/v1/request/${request.id}`);
-    mutate('/api/v1/request?filter=all&take=10&sort=modified&skip=0');
-  };
-
-  const retryRequest = async () => {
-    setRetrying(true);
-
-    try {
-      const response = await axios.post(`/api/v1/request/${request.id}/retry`);
-
-      if (response) {
-        revalidate();
-      }
-    } catch (e) {
-      addToast(intl.formatMessage(messages.failedretry), {
-        autoDismiss: true,
-        appearance: 'error',
-      });
-    } finally {
-      setRetrying(false);
-    }
-  };
-
   useEffect(() => {
     if (title && onTitleData) {
       onTitleData(request.id, title);
@@ -164,242 +85,157 @@ const RequestCard: React.FC<RequestCardProps> = ({ request, onTitleData }) => {
   }
 
   if (!requestData && !requestError) {
-    return <RequestCardError />;
+    return <RequestCardPlaceholder />;
   }
 
   if (!title || !requestData) {
-    return <RequestCardError mediaId={requestData?.media.id} />;
+    return <RequestCardPlaceholder />;
   }
 
   return (
-    <>
-      <RequestModal
-        show={showEditModal}
-        tmdbId={request.media.tmdbId}
-        type={request.type}
-        is4k={request.is4k}
-        editRequest={request}
-        onCancel={() => setShowEditModal(false)}
-        onComplete={() => {
-          revalidate();
-          setShowEditModal(false);
-        }}
-      />
-      <div className="relative flex p-4 overflow-hidden text-gray-400 bg-gray-800 bg-center bg-cover shadow rounded-xl w-72 sm:w-96 ring-1 ring-gray-700">
-        {title.backdropPath && (
-          <div className="absolute inset-0 z-0">
-            <CachedImage
+    <div
+      className="relative flex p-4 text-gray-400 bg-gray-800 bg-center bg-cover rounded-md w-72 sm:w-96"
+      style={{
+        backgroundImage: `linear-gradient(180deg, rgba(17, 24, 39, 0.47) 0%, rgba(17, 24, 39, 1) 100%), url(//image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath})`,
+      }}
+    >
+      <div className="flex flex-col flex-1 min-w-0 pr-4">
+        <h2 className="overflow-hidden text-base text-white cursor-pointer sm:text-lg overflow-ellipsis whitespace-nowrap hover:underline">
+          <Link
+            href={request.type === 'movie' ? '/movie/[movieId]' : '/tv/[tvId]'}
+            as={
+              request.type === 'movie'
+                ? `/movie/${request.media.tmdbId}`
+                : `/tv/${request.media.tmdbId}`
+            }
+          >
+            {isMovie(title) ? title.title : title.name}
+          </Link>
+        </h2>
+        <Link href={`/users/${requestData.requestedBy.id}`}>
+          <a className="flex items-center group">
+            <img
+              src={requestData.requestedBy.avatar}
               alt=""
-              src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath}`}
-              layout="fill"
-              objectFit="cover"
+              className="w-4 mr-1 rounded-full sm:mr-2 sm:w-5"
             />
-            <div
-              className="absolute inset-0"
-              style={{
-                backgroundImage:
-                  'linear-gradient(135deg, rgba(17, 24, 39, 0.47) 0%, rgba(17, 24, 39, 1) 75%)',
-              }}
+            <span className="text-xs truncate sm:text-sm group-hover:underline">
+              {requestData.requestedBy.displayName}
+            </span>
+          </a>
+        </Link>
+        {requestData.media.status && (
+          <div className="mt-1 sm:mt-2">
+            <StatusBadge
+              status={
+                requestData.is4k
+                  ? requestData.media.status4k
+                  : requestData.media.status
+              }
+              is4k={requestData.is4k}
+              inProgress={
+                (
+                  requestData.media[
+                    requestData.is4k ? 'downloadStatus4k' : 'downloadStatus'
+                  ] ?? []
+                ).length > 0
+              }
             />
           </div>
         )}
-        <div className="relative z-10 flex flex-col flex-1 min-w-0 pr-4">
-          <div className="hidden text-xs font-medium text-white sm:flex">
-            {(isMovie(title) ? title.releaseDate : title.firstAirDate)?.slice(
-              0,
-              4
-            )}
-          </div>
-          <Link
-            href={
-              request.type === 'movie'
-                ? `/movie/${requestData.media.tmdbId}`
-                : `/tv/${requestData.media.tmdbId}`
-            }
-          >
-            <a className="overflow-hidden text-base font-bold text-white sm:text-lg overflow-ellipsis whitespace-nowrap hover:underline">
-              {isMovie(title) ? title.title : title.name}
-            </a>
-          </Link>
-          {hasPermission(
-            [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
-            { type: 'or' }
-          ) && (
-            <div className="card-field">
-              <Link href={`/users/${requestData.requestedBy.id}`}>
-                <a className="flex items-center group">
-                  <img
-                    src={requestData.requestedBy.avatar}
-                    alt=""
-                    className="avatar-sm"
-                  />
-                  <span className="truncate group-hover:underline">
-                    {requestData.requestedBy.displayName}
-                  </span>
-                </a>
-              </Link>
-            </div>
-          )}
-          {!isMovie(title) && request.seasons.length > 0 && (
-            <div className="items-center my-0.5 sm:my-1 text-sm hidden sm:flex">
-              <span className="mr-2 font-bold ">
-                {intl.formatMessage(messages.seasons, {
-                  seasonCount:
-                    title.seasons.filter((season) => season.seasonNumber !== 0)
-                      .length === request.seasons.length
-                      ? 0
-                      : request.seasons.length,
-                })}
+        {request.seasons.length > 0 && (
+          <div className="items-center hidden mt-2 text-sm sm:flex">
+            <span className="mr-2">{intl.formatMessage(messages.seasons)}</span>
+            {!isMovie(title) &&
+            title.seasons.filter((season) => season.seasonNumber !== 0)
+              .length === request.seasons.length ? (
+              <span className="mr-2 uppercase">
+                <Badge>{intl.formatMessage(messages.all)}</Badge>
               </span>
-              {title.seasons.filter((season) => season.seasonNumber !== 0)
-                .length === request.seasons.length ? (
-                <span className="mr-2 uppercase">
-                  <Badge>{intl.formatMessage(globalMessages.all)}</Badge>
-                </span>
-              ) : (
-                <div className="overflow-x-scroll hide-scrollbar">
-                  {request.seasons.map((season) => (
-                    <span key={`season-${season.id}`} className="mr-2">
-                      <Badge>{season.seasonNumber}</Badge>
-                    </span>
-                  ))}
-                </div>
-              )}
-            </div>
-          )}
-          <div className="flex items-center mt-2 text-sm sm:mt-1">
-            <span className="hidden mr-2 font-bold sm:block">
-              {intl.formatMessage(globalMessages.status)}
-            </span>
-            {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
-              MediaStatus.UNKNOWN ||
-            requestData.status === MediaRequestStatus.DECLINED ? (
-              <Badge badgeType="danger">
-                {requestData.status === MediaRequestStatus.DECLINED
-                  ? intl.formatMessage(globalMessages.declined)
-                  : intl.formatMessage(globalMessages.failed)}
-              </Badge>
             ) : (
-              <StatusBadge
-                status={
-                  requestData.media[requestData.is4k ? 'status4k' : 'status']
-                }
-                inProgress={
-                  (
-                    requestData.media[
-                      requestData.is4k ? 'downloadStatus4k' : 'downloadStatus'
-                    ] ?? []
-                  ).length > 0
-                }
-                is4k={requestData.is4k}
-                plexUrl={requestData.media.plexUrl}
-                plexUrl4k={requestData.media.plexUrl4k}
-              />
+              <div className="overflow-x-scroll hide-scrollbar">
+                {request.seasons.map((season) => (
+                  <span key={`season-${season.id}`} className="mr-2">
+                    <Badge>{season.seasonNumber}</Badge>
+                  </span>
+                ))}
+              </div>
             )}
           </div>
-          <div className="flex items-end flex-1 space-x-2">
-            {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
-              MediaStatus.UNKNOWN &&
-              requestData.status !== MediaRequestStatus.DECLINED &&
-              hasPermission(Permission.MANAGE_REQUESTS) && (
+        )}
+        {requestData.status === MediaRequestStatus.PENDING &&
+          hasPermission(Permission.MANAGE_REQUESTS) && (
+            <div className="flex items-end flex-1">
+              <span className="mr-2">
                 <Button
-                  buttonType="primary"
+                  buttonType="success"
                   buttonSize="sm"
-                  disabled={isRetrying}
-                  onClick={() => retryRequest()}
+                  onClick={() => modifyRequest('approve')}
                 >
-                  <RefreshIcon
-                    className={isRetrying ? 'animate-spin' : ''}
-                    style={{ marginRight: '0', animationDirection: 'reverse' }}
-                  />
-                  <span className="hidden ml-1.5 sm:block">
-                    {intl.formatMessage(globalMessages.retry)}
+                  <svg
+                    className="w-4 h-4 mr-0 sm:mr-1"
+                    fill="currentColor"
+                    viewBox="0 0 20 20"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      fillRule="evenodd"
+                      d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
+                      clipRule="evenodd"
+                    />
+                  </svg>
+                  <span className="hidden sm:block">
+                    {intl.formatMessage(globalMessages.approve)}
                   </span>
                 </Button>
-              )}
-            {requestData.status === MediaRequestStatus.PENDING &&
-              hasPermission(Permission.MANAGE_REQUESTS) && (
-                <>
-                  <Button
-                    buttonType="success"
-                    buttonSize="sm"
-                    onClick={() => modifyRequest('approve')}
-                  >
-                    <CheckIcon style={{ marginRight: '0' }} />
-                    <span className="hidden ml-1.5 sm:block">
-                      {intl.formatMessage(globalMessages.approve)}
-                    </span>
-                  </Button>
-                  <Button
-                    buttonType="danger"
-                    buttonSize="sm"
-                    onClick={() => modifyRequest('decline')}
-                  >
-                    <XIcon style={{ marginRight: '0' }} />
-                    <span className="hidden ml-1.5 sm:block">
-                      {intl.formatMessage(globalMessages.decline)}
-                    </span>
-                  </Button>
-                </>
-              )}
-            {requestData.status === MediaRequestStatus.PENDING &&
-              !hasPermission(Permission.MANAGE_REQUESTS) &&
-              requestData.requestedBy.id === user?.id &&
-              (requestData.type === 'tv' ||
-                hasPermission(Permission.REQUEST_ADVANCED)) && (
-                <Button
-                  buttonType="primary"
-                  buttonSize="sm"
-                  onClick={() => setShowEditModal(true)}
-                  className={`${
-                    hasPermission(Permission.MANAGE_REQUESTS) ? 'sm:hidden' : ''
-                  }`}
-                >
-                  <PencilIcon style={{ marginRight: '0' }} />
-                  <span className="hidden ml-1.5 sm:block">
-                    {intl.formatMessage(globalMessages.edit)}
-                  </span>
-                </Button>
-              )}
-            {requestData.status === MediaRequestStatus.PENDING &&
-              !hasPermission(Permission.MANAGE_REQUESTS) &&
-              requestData.requestedBy.id === user?.id && (
+              </span>
+              <span>
                 <Button
                   buttonType="danger"
                   buttonSize="sm"
-                  onClick={() => deleteRequest()}
+                  onClick={() => modifyRequest('decline')}
                 >
-                  <XIcon style={{ marginRight: '0' }} />
-                  <span className="hidden ml-1.5 sm:block">
-                    {intl.formatMessage(globalMessages.cancel)}
+                  <svg
+                    className="w-4 h-4 mr-0 sm:mr-1"
+                    fill="currentColor"
+                    viewBox="0 0 20 20"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      fillRule="evenodd"
+                      d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
+                      clipRule="evenodd"
+                    />
+                  </svg>
+                  <span className="hidden sm:block">
+                    {intl.formatMessage(globalMessages.decline)}
                   </span>
                 </Button>
-              )}
-          </div>
-        </div>
+              </span>
+            </div>
+          )}
+      </div>
+      <div className="flex-shrink-0 w-20 sm:w-28">
         <Link
-          href={
+          href={request.type === 'movie' ? '/movie/[movieId]' : '/tv/[tvId]'}
+          as={
             request.type === 'movie'
-              ? `/movie/${requestData.media.tmdbId}`
-              : `/tv/${requestData.media.tmdbId}`
+              ? `/movie/${request.media.tmdbId}`
+              : `/tv/${request.media.tmdbId}`
           }
         >
-          <a className="flex-shrink-0 w-20 overflow-hidden transition duration-300 scale-100 rounded-md shadow-sm cursor-pointer sm:w-28 transform-gpu hover:scale-105 hover:shadow-md">
-            <CachedImage
-              src={
-                title.posterPath
-                  ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
-                  : '/images/overseerr_poster_not_found.png'
-              }
-              alt=""
-              layout="responsive"
-              width={600}
-              height={900}
-            />
-          </a>
+          <img
+            src={
+              title.posterPath
+                ? `//image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
+                : '/images/overseerr_poster_not_found.png'
+            }
+            alt=""
+            className="w-20 transition duration-300 scale-100 rounded-md shadow-sm cursor-pointer sm:w-28 transform-gpu hover:scale-105 hover:shadow-md"
+          />
         </Link>
       </div>
-    </>
+    </div>
   );
 };
 

src/components/RequestList/RequestItem/index.tsx

@@ -1,15 +1,13 @@
-import {
-  CheckIcon,
-  PencilIcon,
-  RefreshIcon,
-  TrashIcon,
-  XIcon,
-} from '@heroicons/react/solid';
 import axios from 'axios';
 import Link from 'next/link';
-import React, { useState } from 'react';
+import React, { useContext, useState } from 'react';
 import { useInView } from 'react-intersection-observer';
-import { defineMessages, FormattedRelativeTime, useIntl } from 'react-intl';
+import {
+  defineMessages,
+  FormattedDate,
+  FormattedRelativeTime,
+  useIntl,
+} from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import {
@@ -19,70 +17,25 @@ import {
 import type { MediaRequest } from '../../../../server/entity/MediaRequest';
 import type { MovieDetails } from '../../../../server/models/Movie';
 import type { TvDetails } from '../../../../server/models/Tv';
+import { LanguageContext } from '../../../context/LanguageContext';
 import { Permission, useUser } from '../../../hooks/useUser';
 import globalMessages from '../../../i18n/globalMessages';
 import Badge from '../../Common/Badge';
 import Button from '../../Common/Button';
-import CachedImage from '../../Common/CachedImage';
-import ConfirmButton from '../../Common/ConfirmButton';
+import Table from '../../Common/Table';
 import RequestModal from '../../RequestModal';
 import StatusBadge from '../../StatusBadge';
 
 const messages = defineMessages({
-  seasons: '{seasonCount, plural, one {Season} other {Seasons}}',
+  seasons: 'Seasons',
+  notavailable: 'N/A',
   failedretry: 'Something went wrong while retrying the request.',
-  requested: 'Requested',
-  requesteddate: 'Requested',
-  modified: 'Modified',
-  modifieduserdate: '{date} by {user}',
-  mediaerror: 'The associated title for this request is no longer available.',
-  editrequest: 'Edit Request',
-  deleterequest: 'Delete Request',
-  cancelRequest: 'Cancel Request',
 });
 
 const isMovie = (movie: MovieDetails | TvDetails): movie is MovieDetails => {
   return (movie as MovieDetails).title !== undefined;
 };
 
-interface RequestItemErroProps {
-  mediaId?: number;
-  revalidateList: () => void;
-}
-
-const RequestItemError: React.FC<RequestItemErroProps> = ({
-  mediaId,
-  revalidateList,
-}) => {
-  const intl = useIntl();
-  const { hasPermission } = useUser();
-
-  const deleteRequest = async () => {
-    await axios.delete(`/api/v1/media/${mediaId}`);
-    revalidateList();
-  };
-
-  return (
-    <div className="flex flex-col items-center justify-center w-full h-64 px-10 bg-gray-800 lg:flex-row ring-1 ring-red-500 rounded-xl xl:h-32">
-      <span className="text-sm text-center text-gray-300 lg:text-left">
-        {intl.formatMessage(messages.mediaerror)}
-      </span>
-      {hasPermission(Permission.MANAGE_REQUESTS) && mediaId && (
-        <div className="mt-4 lg:ml-4 lg:mt-0">
-          <Button
-            buttonType="danger"
-            buttonSize="sm"
-            onClick={() => deleteRequest()}
-          >
-            <TrashIcon />
-            <span>{intl.formatMessage(messages.deleterequest)}</span>
-          </Button>
-        </div>
-      )}
-    </div>
-  );
-};
-
 interface RequestItemProps {
   request: MediaRequest;
   revalidateList: () => void;
@@ -97,14 +50,15 @@ const RequestItem: React.FC<RequestItemProps> = ({
   });
   const { addToast } = useToasts();
   const intl = useIntl();
-  const { user, hasPermission } = useUser();
+  const { hasPermission } = useUser();
   const [showEditModal, setShowEditModal] = useState(false);
+  const { locale } = useContext(LanguageContext);
   const url =
     request.type === 'movie'
       ? `/api/v1/movie/${request.media.tmdbId}`
       : `/api/v1/tv/${request.media.tmdbId}`;
   const { data: title, error } = useSWR<MovieDetails | TvDetails>(
-    inView ? `${url}` : null
+    inView ? `${url}?language=${locale}` : null
   );
   const {
     data: requestData,
@@ -148,24 +102,22 @@ const RequestItem: React.FC<RequestItemProps> = ({
 
   if (!title && !error) {
     return (
-      <div
-        className="w-full h-64 bg-gray-800 rounded-xl xl:h-32 animate-pulse"
-        ref={ref}
-      />
+      <tr className="w-full h-24 animate-pulse" ref={ref}>
+        <td colSpan={6}></td>
+      </tr>
     );
   }
 
   if (!title || !requestData) {
     return (
-      <RequestItemError
-        mediaId={requestData?.media.id}
-        revalidateList={revalidateList}
-      />
+      <tr className="w-full h-24 animate-pulse">
+        <td colSpan={6}></td>
+      </tr>
     );
   }
 
   return (
-    <>
+    <tr className="relative w-full h-24 p-2">
       <RequestModal
         show={showEditModal}
         tmdbId={request.media.tmdbId}
@@ -178,26 +130,28 @@ const RequestItem: React.FC<RequestItemProps> = ({
           setShowEditModal(false);
         }}
       />
-      <div className="relative flex flex-col justify-between w-full py-4 overflow-hidden text-gray-400 bg-gray-800 shadow-md ring-1 ring-gray-700 rounded-xl xl:h-32 xl:flex-row">
-        {title.backdropPath && (
-          <div className="absolute inset-0 z-0 w-full bg-center bg-cover xl:w-2/3">
-            <CachedImage
-              src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath}`}
-              alt=""
-              layout="fill"
-              objectFit="cover"
-            />
-            <div
-              className="absolute inset-0"
-              style={{
-                backgroundImage:
-                  'linear-gradient(90deg, rgba(31, 41, 55, 0.47) 0%, rgba(31, 41, 55, 1) 100%)',
-              }}
-            />
-          </div>
-        )}
-        <div className="relative flex flex-col justify-between w-full overflow-hidden sm:flex-row">
-          <div className="relative z-10 flex items-center w-full pl-4 pr-4 overflow-hidden xl:w-7/12 2xl:w-2/3 sm:pr-0">
+      <Table.TD>
+        <div className="flex items-center">
+          <Link
+            href={
+              request.type === 'movie'
+                ? `/movie/${request.media.tmdbId}`
+                : `/tv/${request.media.tmdbId}`
+            }
+          >
+            <a className="flex-shrink-0 hidden mr-4 sm:block">
+              <img
+                src={
+                  title.posterPath
+                    ? `//image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
+                    : '/images/overseerr_poster_not_found.png'
+                }
+                alt=""
+                className="w-12 transition duration-300 scale-100 rounded-md shadow-sm cursor-pointer transform-gpu hover:scale-105 hover:shadow-md"
+              />
+            </a>
+          </Link>
+          <div className="flex-shrink overflow-hidden">
             <Link
               href={
                 requestData.type === 'movie'
@@ -205,285 +159,219 @@ const RequestItem: React.FC<RequestItemProps> = ({
                   : `/tv/${requestData.media.tmdbId}`
               }
             >
-              <a className="relative flex-shrink-0 w-12 h-auto overflow-hidden transition duration-300 scale-100 rounded-md sm:w-14 transform-gpu hover:scale-105">
-                <CachedImage
-                  src={
-                    title.posterPath
-                      ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
-                      : '/images/overseerr_poster_not_found.png'
-                  }
-                  alt=""
-                  layout="responsive"
-                  width={600}
-                  height={900}
-                  objectFit="cover"
-                />
+              <a className="min-w-0 mr-2 text-xl text-white truncate hover:underline">
+                {isMovie(title) ? title.title : title.name}
               </a>
             </Link>
-            <div className="flex flex-col justify-center pl-2 overflow-hidden xl:pl-4">
-              <div className="font-medium pt-0.5 sm:pt-1 text-xs text-white">
-                {(isMovie(title)
-                  ? title.releaseDate
-                  : title.firstAirDate
-                )?.slice(0, 4)}
-              </div>
-              <Link
-                href={
-                  requestData.type === 'movie'
-                    ? `/movie/${requestData.media.tmdbId}`
-                    : `/tv/${requestData.media.tmdbId}`
-                }
-              >
-                <a className="min-w-0 mr-2 text-lg font-bold text-white truncate xl:text-xl hover:underline">
-                  {isMovie(title) ? title.title : title.name}
-                </a>
-              </Link>
-              {!isMovie(title) && request.seasons.length > 0 && (
-                <div className="card-field">
-                  <span className="card-field-name">
-                    {intl.formatMessage(messages.seasons, {
-                      seasonCount:
-                        title.seasons.filter(
-                          (season) => season.seasonNumber !== 0
-                        ).length === request.seasons.length
-                          ? 0
-                          : request.seasons.length,
-                    })}
-                  </span>
-                  {title.seasons.filter((season) => season.seasonNumber !== 0)
-                    .length === request.seasons.length ? (
-                    <span className="mr-2 uppercase">
-                      <Badge>{intl.formatMessage(globalMessages.all)}</Badge>
-                    </span>
-                  ) : (
-                    <div className="flex overflow-x-scroll hide-scrollbar flex-nowrap">
-                      {request.seasons.map((season) => (
-                        <span key={`season-${season.id}`} className="mr-2">
-                          <Badge>{season.seasonNumber}</Badge>
-                        </span>
-                      ))}
-                    </div>
-                  )}
-                </div>
-              )}
-            </div>
-          </div>
-          <div className="z-10 flex flex-col justify-center w-full pr-4 mt-4 ml-4 overflow-hidden text-sm sm:ml-2 sm:mt-0 xl:flex-1 xl:pr-0">
-            <div className="card-field">
-              <span className="card-field-name">
-                {intl.formatMessage(globalMessages.status)}
-              </span>
-              {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
-                MediaStatus.UNKNOWN ||
-              requestData.status === MediaRequestStatus.DECLINED ? (
-                <Badge badgeType="danger">
-                  {requestData.status === MediaRequestStatus.DECLINED
-                    ? intl.formatMessage(globalMessages.declined)
-                    : intl.formatMessage(globalMessages.failed)}
-                </Badge>
-              ) : (
-                <StatusBadge
-                  status={
-                    requestData.media[requestData.is4k ? 'status4k' : 'status']
-                  }
-                  inProgress={
-                    (
-                      requestData.media[
-                        requestData.is4k ? 'downloadStatus4k' : 'downloadStatus'
-                      ] ?? []
-                    ).length > 0
-                  }
-                  is4k={requestData.is4k}
-                  plexUrl={requestData.media.plexUrl}
-                  plexUrl4k={requestData.media.plexUrl4k}
+            <Link href={`/users/${requestData.requestedBy.id}`}>
+              <a className="flex items-center mt-1">
+                <img
+                  src={requestData.requestedBy.avatar}
+                  alt=""
+                  className="w-5 mr-2 rounded-full"
                 />
-              )}
-            </div>
-            <div className="card-field">
-              {hasPermission(
-                [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
-                { type: 'or' }
-              ) ? (
-                <>
-                  <span className="card-field-name">
-                    {intl.formatMessage(messages.requested)}
-                  </span>
-                  <span className="flex text-sm text-gray-300 truncate">
-                    {intl.formatMessage(messages.modifieduserdate, {
-                      date: (
-                        <FormattedRelativeTime
-                          value={Math.floor(
-                            (new Date(requestData.createdAt).getTime() -
-                              Date.now()) /
-                              1000
-                          )}
-                          updateIntervalInSeconds={1}
-                          numeric="auto"
-                        />
-                      ),
-                      user: (
-                        <Link href={`/users/${requestData.requestedBy.id}`}>
-                          <a className="flex items-center truncate group">
-                            <img
-                              src={requestData.requestedBy.avatar}
-                              alt=""
-                              className="ml-1.5 avatar-sm"
-                            />
-                            <span className="text-sm truncate group-hover:underline">
-                              {requestData.requestedBy.displayName}
-                            </span>
-                          </a>
-                        </Link>
-                      ),
-                    })}
-                  </span>
-                </>
-              ) : (
-                <>
-                  <span className="card-field-name">
-                    {intl.formatMessage(messages.requesteddate)}
-                  </span>
-                  <span className="flex text-sm text-gray-300 truncate">
-                    <FormattedRelativeTime
-                      value={Math.floor(
-                        (new Date(requestData.createdAt).getTime() -
-                          Date.now()) /
-                          1000
-                      )}
-                      updateIntervalInSeconds={1}
-                      numeric="auto"
-                    />
-                  </span>
-                </>
-              )}
-            </div>
-            {requestData.modifiedBy && (
-              <div className="card-field">
-                <span className="card-field-name">
-                  {intl.formatMessage(messages.modified)}
+                <span className="text-sm hover:underline">
+                  {requestData.requestedBy.displayName}
                 </span>
-                <span className="flex text-sm text-gray-300 truncate">
-                  {intl.formatMessage(messages.modifieduserdate, {
-                    date: (
-                      <FormattedRelativeTime
-                        value={Math.floor(
-                          (new Date(requestData.updatedAt).getTime() -
-                            Date.now()) /
-                            1000
-                        )}
-                        updateIntervalInSeconds={1}
-                        numeric="auto"
-                      />
-                    ),
-                    user: (
-                      <Link href={`/users/${requestData.modifiedBy.id}`}>
-                        <a className="flex items-center truncate group">
-                          <img
-                            src={requestData.modifiedBy.avatar}
-                            alt=""
-                            className="ml-1.5 avatar-sm"
-                          />
-                          <span className="text-sm truncate group-hover:underline">
-                            {requestData.modifiedBy.displayName}
-                          </span>
-                        </a>
-                      </Link>
-                    ),
-                  })}
+              </a>
+            </Link>
+            {requestData.seasons.length > 0 && (
+              <div className="items-center hidden mt-2 text-sm sm:flex">
+                <span className="mr-2">
+                  {intl.formatMessage(messages.seasons)}
                 </span>
+                {requestData.seasons.map((season) => (
+                  <span key={`season-${season.id}`} className="mr-2">
+                    <Badge>{season.seasonNumber}</Badge>
+                  </span>
+                ))}
               </div>
             )}
           </div>
         </div>
-        <div className="z-10 flex flex-col justify-center w-full pl-4 pr-4 mt-4 space-y-2 xl:mt-0 xl:items-end xl:w-96 xl:pl-0">
-          {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
-            MediaStatus.UNKNOWN &&
-            requestData.status !== MediaRequestStatus.DECLINED &&
-            hasPermission(Permission.MANAGE_REQUESTS) && (
-              <Button
-                className="w-full"
-                buttonType="primary"
-                disabled={isRetrying}
-                onClick={() => retryRequest()}
-              >
-                <RefreshIcon
-                  className={isRetrying ? 'animate-spin' : ''}
-                  style={{ animationDirection: 'reverse' }}
+      </Table.TD>
+      <Table.TD>
+        {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
+          MediaStatus.UNKNOWN ||
+        requestData.status === MediaRequestStatus.DECLINED ? (
+          <Badge badgeType="danger">
+            {requestData.status === MediaRequestStatus.DECLINED
+              ? intl.formatMessage(globalMessages.declined)
+              : intl.formatMessage(globalMessages.failed)}
+          </Badge>
+        ) : (
+          <StatusBadge
+            status={requestData.media[requestData.is4k ? 'status4k' : 'status']}
+            inProgress={
+              (
+                requestData.media[
+                  requestData.is4k ? 'downloadStatus4k' : 'downloadStatus'
+                ] ?? []
+              ).length > 0
+            }
+            is4k={requestData.is4k}
+          />
+        )}
+      </Table.TD>
+      <Table.TD>
+        <div className="flex flex-col">
+          <span className="text-sm text-gray-300">
+            <FormattedDate value={requestData.createdAt} />
+          </span>
+        </div>
+      </Table.TD>
+      <Table.TD>
+        <div className="flex flex-col">
+          {requestData.modifiedBy ? (
+            <span className="text-sm text-gray-300">
+              <div className="flex items-center">
+                <img
+                  src={requestData.modifiedBy.avatar}
+                  alt=""
+                  className="w-5 mr-2 rounded-full"
                 />
-                <span>
-                  {intl.formatMessage(
-                    isRetrying ? globalMessages.retrying : globalMessages.retry
-                  )}
-                </span>
-              </Button>
-            )}
-          {requestData.status !== MediaRequestStatus.PENDING &&
-            hasPermission(Permission.MANAGE_REQUESTS) && (
-              <ConfirmButton
-                onClick={() => deleteRequest()}
-                confirmText={intl.formatMessage(globalMessages.areyousure)}
-                className="w-full"
-              >
-                <TrashIcon />
-                <span>{intl.formatMessage(messages.deleterequest)}</span>
-              </ConfirmButton>
-            )}
-          {requestData.status === MediaRequestStatus.PENDING &&
-            hasPermission(Permission.MANAGE_REQUESTS) && (
-              <div className="flex flex-row w-full space-x-2">
-                <span className="w-full">
-                  <Button
-                    className="w-full"
-                    buttonType="success"
-                    onClick={() => modifyRequest('approve')}
-                  >
-                    <CheckIcon />
-                    <span>{intl.formatMessage(globalMessages.approve)}</span>
-                  </Button>
-                </span>
-                <span className="w-full">
-                  <Button
-                    className="w-full"
-                    buttonType="danger"
-                    onClick={() => modifyRequest('decline')}
-                  >
-                    <XIcon />
-                    <span>{intl.formatMessage(globalMessages.decline)}</span>
-                  </Button>
+                <span className="text-sm">
+                  {requestData.modifiedBy.displayName} (
+                  <FormattedRelativeTime
+                    value={Math.floor(
+                      (new Date(requestData.updatedAt).getTime() - Date.now()) /
+                        1000
+                    )}
+                    updateIntervalInSeconds={1}
+                  />
+                  )
                 </span>
               </div>
-            )}
-          {requestData.status === MediaRequestStatus.PENDING &&
-            (hasPermission(Permission.MANAGE_REQUESTS) ||
-              (requestData.requestedBy.id === user?.id &&
-                (requestData.type === 'tv' ||
-                  hasPermission(Permission.REQUEST_ADVANCED)))) && (
-              <span className="w-full">
+            </span>
+          ) : (
+            <span className="text-sm text-gray-300">N/A</span>
+          )}
+        </div>
+      </Table.TD>
+      <Table.TD alignText="right">
+        {requestData.media[requestData.is4k ? 'status4k' : 'status'] ===
+          MediaStatus.UNKNOWN &&
+          requestData.status !== MediaRequestStatus.DECLINED &&
+          hasPermission(Permission.MANAGE_REQUESTS) && (
+            <Button
+              className="mr-2"
+              buttonType="primary"
+              buttonSize="sm"
+              disabled={isRetrying}
+              onClick={() => retryRequest()}
+            >
+              <svg
+                className="w-4 h-4 mr-0 sm:mr-1"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="18px"
+                height="18px"
+              >
+                <path d="M0 0h24v24H0z" fill="none" />
+                <path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z" />
+              </svg>
+              <span className="hidden sm:block">
+                {intl.formatMessage(globalMessages.retry)}
+              </span>
+            </Button>
+          )}
+        {requestData.status !== MediaRequestStatus.PENDING &&
+          hasPermission(Permission.MANAGE_REQUESTS) && (
+            <Button
+              buttonType="danger"
+              buttonSize="sm"
+              onClick={() => deleteRequest()}
+            >
+              <svg
+                className="w-4 h-4 mr-0 sm:mr-1"
+                fill="currentColor"
+                viewBox="0 0 20 20"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  fillRule="evenodd"
+                  d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z"
+                  clipRule="evenodd"
+                />
+              </svg>
+              <span className="hidden sm:block">
+                {intl.formatMessage(globalMessages.delete)}
+              </span>
+            </Button>
+          )}
+        {requestData.status === MediaRequestStatus.PENDING &&
+          hasPermission(Permission.MANAGE_REQUESTS) && (
+            <>
+              <span className="mr-2">
                 <Button
-                  className="w-full"
-                  buttonType="primary"
-                  onClick={() => setShowEditModal(true)}
+                  buttonType="success"
+                  buttonSize="sm"
+                  onClick={() => modifyRequest('approve')}
                 >
-                  <PencilIcon />
-                  <span>{intl.formatMessage(messages.editrequest)}</span>
+                  <svg
+                    className="w-4 h-4 mr-0 sm:mr-1"
+                    fill="currentColor"
+                    viewBox="0 0 20 20"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      fillRule="evenodd"
+                      d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
+                      clipRule="evenodd"
+                    />
+                  </svg>
+                  <span className="hidden sm:block">
+                    {intl.formatMessage(globalMessages.approve)}
+                  </span>
                 </Button>
               </span>
-            )}
-          {requestData.status === MediaRequestStatus.PENDING &&
-            !hasPermission(Permission.MANAGE_REQUESTS) &&
-            requestData.requestedBy.id === user?.id && (
-              <ConfirmButton
-                onClick={() => deleteRequest()}
-                confirmText={intl.formatMessage(globalMessages.areyousure)}
-                className="w-full"
-              >
-                <XIcon />
-                <span>{intl.formatMessage(messages.cancelRequest)}</span>
-              </ConfirmButton>
-            )}
-        </div>
-      </div>
-    </>
+              <span className="mr-2">
+                <Button
+                  buttonType="danger"
+                  buttonSize="sm"
+                  onClick={() => modifyRequest('decline')}
+                >
+                  <svg
+                    className="w-4 h-4 mr-0 sm:mr-1"
+                    fill="currentColor"
+                    viewBox="0 0 20 20"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      fillRule="evenodd"
+                      d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
+                      clipRule="evenodd"
+                    />
+                  </svg>
+                  <span className="hidden sm:block">
+                    {intl.formatMessage(globalMessages.decline)}
+                  </span>
+                </Button>
+              </span>
+              <span>
+                <Button
+                  buttonType="primary"
+                  buttonSize="sm"
+                  onClick={() => setShowEditModal(true)}
+                >
+                  <svg
+                    className="w-4 h-4 mr-0 sm:mr-1"
+                    fill="currentColor"
+                    viewBox="0 0 20 20"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z" />
+                  </svg>
+                  <span className="hidden sm:block">
+                    {intl.formatMessage(globalMessages.edit)}
+                  </span>
+                </Button>
+              </span>
+            </>
+          )}
+      </Table.TD>
+    </tr>
   );
 };
 

src/components/RequestList/index.tsx

@@ -1,94 +1,51 @@
-import {
-  ChevronLeftIcon,
-  ChevronRightIcon,
-  FilterIcon,
-  SortDescendingIcon,
-} from '@heroicons/react/solid';
-import Link from 'next/link';
-import { useRouter } from 'next/router';
-import React, { useEffect, useState } from 'react';
-import { defineMessages, useIntl } from 'react-intl';
+import React, { useState } from 'react';
 import useSWR from 'swr';
 import type { RequestResultsResponse } from '../../../server/interfaces/api/requestInterfaces';
-import { useUpdateQueryParams } from '../../hooks/useUpdateQueryParams';
-import { useUser } from '../../hooks/useUser';
-import globalMessages from '../../i18n/globalMessages';
-import Button from '../Common/Button';
-import Header from '../Common/Header';
 import LoadingSpinner from '../Common/LoadingSpinner';
-import PageTitle from '../Common/PageTitle';
 import RequestItem from './RequestItem';
+import Header from '../Common/Header';
+import Table from '../Common/Table';
+import Button from '../Common/Button';
+import { defineMessages, useIntl } from 'react-intl';
+import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   requests: 'Requests',
+  mediaInfo: 'Media Info',
+  status: 'Status',
+  requestedAt: 'Requested At',
+  modifiedBy: 'Last Modified By',
+  showingresults:
+    'Showing <strong>{from}</strong> to <strong>{to}</strong> of <strong>{total}</strong> results',
+  resultsperpage: 'Display {pageSize} results per page',
+  next: 'Next',
+  previous: 'Previous',
+  filterAll: 'All',
+  filterPending: 'Pending',
+  filterApproved: 'Approved',
+  filterAvailable: 'Available',
+  filterProcessing: 'Processing',
+  noresults: 'No results.',
   showallrequests: 'Show All Requests',
   sortAdded: 'Request Date',
   sortModified: 'Last Modified',
 });
 
-enum Filter {
-  ALL = 'all',
-  PENDING = 'pending',
-  APPROVED = 'approved',
-  PROCESSING = 'processing',
-  AVAILABLE = 'available',
-  UNAVAILABLE = 'unavailable',
-}
-
+type Filter = 'all' | 'pending' | 'approved' | 'processing' | 'available';
 type Sort = 'added' | 'modified';
 
 const RequestList: React.FC = () => {
-  const router = useRouter();
   const intl = useIntl();
-  const { user } = useUser({
-    id: Number(router.query.userId),
-  });
-  const [currentFilter, setCurrentFilter] = useState<Filter>(Filter.PENDING);
+  const [pageIndex, setPageIndex] = useState(0);
+  const [currentFilter, setCurrentFilter] = useState<Filter>('pending');
   const [currentSort, setCurrentSort] = useState<Sort>('added');
   const [currentPageSize, setCurrentPageSize] = useState<number>(10);
 
-  const page = router.query.page ? Number(router.query.page) : 1;
-  const pageIndex = page - 1;
-  const updateQueryParams = useUpdateQueryParams({ page: page.toString() });
-
   const { data, error, revalidate } = useSWR<RequestResultsResponse>(
     `/api/v1/request?take=${currentPageSize}&skip=${
       pageIndex * currentPageSize
-    }&filter=${currentFilter}&sort=${currentSort}${
-      router.query.userId ? `&requestedBy=${router.query.userId}` : ''
-    }`
+    }&filter=${currentFilter}&sort=${currentSort}`
   );
-
-  // Restore last set filter values on component mount
-  useEffect(() => {
-    const filterString = window.localStorage.getItem('rl-filter-settings');
-
-    if (filterString) {
-      const filterSettings = JSON.parse(filterString);
-
-      setCurrentFilter(filterSettings.currentFilter);
-      setCurrentSort(filterSettings.currentSort);
-      setCurrentPageSize(filterSettings.currentPageSize);
-    }
-
-    // If filter value is provided in query, use that instead
-    if (Object.values(Filter).includes(router.query.filter as Filter)) {
-      setCurrentFilter(router.query.filter as Filter);
-    }
-  }, [router.query.filter]);
-
-  // Set filter values to local storage any time they are changed
-  useEffect(() => {
-    window.localStorage.setItem(
-      'rl-filter-settings',
-      JSON.stringify({
-        currentFilter,
-        currentSort,
-        currentPageSize,
-      })
-    );
-  }, [currentFilter, currentSort, currentPageSize]);
-
   if (!data && !error) {
     return <LoadingSpinner />;
   }
@@ -102,81 +59,73 @@ const RequestList: React.FC = () => {
 
   return (
     <>
-      <PageTitle
-        title={[
-          intl.formatMessage(messages.requests),
-          router.query.userId ? user?.displayName : '',
-        ]}
-      />
-      <div className="flex flex-col justify-between mb-4 lg:items-end lg:flex-row">
-        <Header
-          subtext={
-            router.query.userId ? (
-              <Link href={`/users/${user?.id}`}>
-                <a className="hover:underline">{user?.displayName}</a>
-              </Link>
-            ) : (
-              ''
-            )
-          }
-        >
-          {intl.formatMessage(messages.requests)}
-        </Header>
+      <PageTitle title={intl.formatMessage(messages.requests)} />
+      <div className="flex flex-col justify-between lg:items-end lg:flex-row">
+        <Header>{intl.formatMessage(messages.requests)}</Header>
         <div className="flex flex-col flex-grow mt-2 sm:flex-row lg:flex-grow-0">
           <div className="flex flex-grow mb-2 sm:mb-0 sm:mr-2 lg:flex-grow-0">
             <span className="inline-flex items-center px-3 text-sm text-gray-100 bg-gray-800 border border-r-0 border-gray-500 cursor-default rounded-l-md">
-              <FilterIcon className="w-6 h-6" />
+              <svg
+                className="w-6 h-6"
+                fill="currentColor"
+                viewBox="0 0 20 20"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  fillRule="evenodd"
+                  d="M3 3a1 1 0 011-1h12a1 1 0 011 1v3a1 1 0 01-.293.707L12 11.414V15a1 1 0 01-.293.707l-2 2A1 1 0 018 17v-5.586L3.293 6.707A1 1 0 013 6V3z"
+                  clipRule="evenodd"
+                />
+              </svg>
             </span>
             <select
               id="filter"
               name="filter"
               onChange={(e) => {
+                setPageIndex(0);
                 setCurrentFilter(e.target.value as Filter);
-                router.push({
-                  pathname: router.pathname,
-                  query: router.query.userId
-                    ? { userId: router.query.userId }
-                    : {},
-                });
               }}
               value={currentFilter}
               className="rounded-r-only"
             >
               <option value="all">
-                {intl.formatMessage(globalMessages.all)}
+                {intl.formatMessage(messages.filterAll)}
               </option>
               <option value="pending">
-                {intl.formatMessage(globalMessages.pending)}
+                {intl.formatMessage(messages.filterPending)}
               </option>
               <option value="approved">
-                {intl.formatMessage(globalMessages.approved)}
+                {intl.formatMessage(messages.filterApproved)}
               </option>
               <option value="processing">
-                {intl.formatMessage(globalMessages.processing)}
+                {intl.formatMessage(messages.filterProcessing)}
               </option>
               <option value="available">
-                {intl.formatMessage(globalMessages.available)}
-              </option>
-              <option value="unavailable">
-                {intl.formatMessage(globalMessages.unavailable)}
+                {intl.formatMessage(messages.filterAvailable)}
               </option>
             </select>
           </div>
           <div className="flex flex-grow mb-2 sm:mb-0 lg:flex-grow-0">
             <span className="inline-flex items-center px-3 text-gray-100 bg-gray-800 border border-r-0 border-gray-500 cursor-default sm:text-sm rounded-l-md">
-              <SortDescendingIcon className="w-6 h-6" />
+              <svg
+                className="w-6 h-6"
+                fill="currentColor"
+                viewBox="0 0 20 20"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path d="M3 3a1 1 0 000 2h11a1 1 0 100-2H3zM3 7a1 1 0 000 2h7a1 1 0 100-2H3zM3 11a1 1 0 100 2h4a1 1 0 100-2H3zM15 8a1 1 0 10-2 0v5.586l-1.293-1.293a1 1 0 00-1.414 1.414l3 3a1 1 0 001.414 0l3-3a1 1 0 00-1.414-1.414L15 13.586V8z" />
+              </svg>
             </span>
             <select
               id="sort"
               name="sort"
               onChange={(e) => {
+                setPageIndex(0);
+                setCurrentSort(e.target.value as Sort);
+              }}
+              onBlur={(e) => {
+                setPageIndex(0);
                 setCurrentSort(e.target.value as Sort);
-                router.push({
-                  pathname: router.pathname,
-                  query: router.query.userId
-                    ? { userId: router.query.userId }
-                    : {},
-                });
               }}
               value={currentSort}
               className="rounded-r-only"
@@ -191,104 +140,114 @@ const RequestList: React.FC = () => {
           </div>
         </div>
       </div>
-      {data.results.map((request) => {
-        return (
-          <div className="py-2" key={`request-list-${request.id}`}>
-            <RequestItem
-              request={request}
-              revalidateList={() => revalidate()}
-            />
-          </div>
-        );
-      })}
+      <Table>
+        <thead>
+          <tr>
+            <Table.TH>{intl.formatMessage(messages.mediaInfo)}</Table.TH>
+            <Table.TH>{intl.formatMessage(messages.status)}</Table.TH>
+            <Table.TH>{intl.formatMessage(messages.requestedAt)}</Table.TH>
+            <Table.TH>{intl.formatMessage(messages.modifiedBy)}</Table.TH>
+            <Table.TH></Table.TH>
+          </tr>
+        </thead>
+        <Table.TBody>
+          {data.results.map((request) => {
+            return (
+              <RequestItem
+                request={request}
+                key={`request-list-${request.id}`}
+                revalidateList={() => revalidate()}
+              />
+            );
+          })}
 
-      {data.results.length === 0 && (
-        <div className="flex flex-col items-center justify-center w-full py-24 text-white">
-          <span className="text-2xl text-gray-400">
-            {intl.formatMessage(globalMessages.noresults)}
-          </span>
-          {currentFilter !== Filter.ALL && (
-            <div className="mt-4">
-              <Button
-                buttonType="primary"
-                onClick={() => setCurrentFilter(Filter.ALL)}
-              >
-                {intl.formatMessage(messages.showallrequests)}
-              </Button>
-            </div>
+          {data.results.length === 0 && (
+            <tr className="relative h-24 p-2 text-white">
+              <Table.TD colSpan={6} noPadding>
+                <div className="flex flex-col items-center justify-center w-screen p-6 lg:w-full">
+                  <span className="text-base">
+                    {intl.formatMessage(messages.noresults)}
+                  </span>
+                  {currentFilter !== 'all' && (
+                    <div className="mt-4">
+                      <Button
+                        buttonSize="sm"
+                        buttonType="primary"
+                        onClick={() => setCurrentFilter('all')}
+                      >
+                        {intl.formatMessage(messages.showallrequests)}
+                      </Button>
+                    </div>
+                  )}
+                </div>
+              </Table.TD>
+            </tr>
           )}
-        </div>
-      )}
-      <div className="actions">
-        <nav
-          className="flex flex-col items-center mb-3 space-y-3 sm:space-y-0 sm:flex-row"
-          aria-label="Pagination"
-        >
-          <div className="hidden lg:flex lg:flex-1">
-            <p className="text-sm">
-              {data.results.length > 0 &&
-                intl.formatMessage(globalMessages.showingresults, {
-                  from: pageIndex * currentPageSize + 1,
-                  to:
-                    data.results.length < currentPageSize
-                      ? pageIndex * currentPageSize + data.results.length
-                      : (pageIndex + 1) * currentPageSize,
-                  total: data.pageInfo.results,
-                  strong: function strong(msg) {
-                    return <span className="font-medium">{msg}</span>;
-                  },
-                })}
-            </p>
-          </div>
-          <div className="flex justify-center sm:flex-1 sm:justify-start lg:justify-center">
-            <span className="items-center -mt-3 text-sm truncate sm:mt-0">
-              {intl.formatMessage(globalMessages.resultsperpage, {
-                pageSize: (
-                  <select
-                    id="pageSize"
-                    name="pageSize"
-                    onChange={(e) => {
-                      setCurrentPageSize(Number(e.target.value));
-                      router
-                        .push({
-                          pathname: router.pathname,
-                          query: router.query.userId
-                            ? { userId: router.query.userId }
-                            : {},
-                        })
-                        .then(() => window.scrollTo(0, 0));
-                    }}
-                    value={currentPageSize}
-                    className="inline short"
+          <tr className="bg-gray-700">
+            <Table.TD colSpan={6} noPadding>
+              <nav
+                className="flex flex-col items-center w-screen px-6 py-3 space-x-4 space-y-3 sm:space-y-0 sm:flex-row lg:w-full"
+                aria-label="Pagination"
+              >
+                <div className="hidden lg:flex lg:flex-1">
+                  <p className="text-sm">
+                    {data.results.length > 0 &&
+                      intl.formatMessage(messages.showingresults, {
+                        from: pageIndex * currentPageSize + 1,
+                        to:
+                          data.results.length < currentPageSize
+                            ? pageIndex * currentPageSize + data.results.length
+                            : (pageIndex + 1) * currentPageSize,
+                        total: data.pageInfo.results,
+                        strong: function strong(msg) {
+                          return <span className="font-medium">{msg}</span>;
+                        },
+                      })}
+                  </p>
+                </div>
+                <div className="flex justify-center sm:flex-1 sm:justify-start lg:justify-center">
+                  <span className="items-center -mt-3 text-sm sm:-ml-4 lg:ml-0 sm:mt-0">
+                    {intl.formatMessage(messages.resultsperpage, {
+                      pageSize: (
+                        <select
+                          id="pageSize"
+                          name="pageSize"
+                          onChange={(e) => {
+                            setPageIndex(0);
+                            setCurrentPageSize(Number(e.target.value));
+                          }}
+                          value={currentPageSize}
+                          className="inline short"
+                        >
+                          <option value="5">5</option>
+                          <option value="10">10</option>
+                          <option value="25">25</option>
+                          <option value="50">50</option>
+                          <option value="100">100</option>
+                        </select>
+                      ),
+                    })}
+                  </span>
+                </div>
+                <div className="flex justify-center flex-auto space-x-2 sm:justify-end sm:flex-1">
+                  <Button
+                    disabled={!hasPrevPage}
+                    onClick={() => setPageIndex((current) => current - 1)}
                   >
-                    <option value="5">5</option>
-                    <option value="10">10</option>
-                    <option value="25">25</option>
-                    <option value="50">50</option>
-                    <option value="100">100</option>
-                  </select>
-                ),
-              })}
-            </span>
-          </div>
-          <div className="flex justify-center flex-auto space-x-2 sm:justify-end sm:flex-1">
-            <Button
-              disabled={!hasPrevPage}
-              onClick={() => updateQueryParams('page', (page - 1).toString())}
-            >
-              <ChevronLeftIcon />
-              <span>{intl.formatMessage(globalMessages.previous)}</span>
-            </Button>
-            <Button
-              disabled={!hasNextPage}
-              onClick={() => updateQueryParams('page', (page + 1).toString())}
-            >
-              <span>{intl.formatMessage(globalMessages.next)}</span>
-              <ChevronRightIcon />
-            </Button>
-          </div>
-        </nav>
-      </div>
+                    {intl.formatMessage(messages.previous)}
+                  </Button>
+                  <Button
+                    disabled={!hasNextPage}
+                    onClick={() => setPageIndex((current) => current + 1)}
+                  >
+                    {intl.formatMessage(messages.next)}
+                  </Button>
+                </div>
+              </nav>
+            </Table.TD>
+          </tr>
+        </Table.TBody>
+      </Table>
     </>
   );
 };

src/components/Settings/SettingsJellyfin.tsx

@@ -0,0 +1,283 @@
+import React, { useState } from 'react';
+import LoadingSpinner from '../Common/LoadingSpinner';
+import type { JellyfinSettings } from '../../../server/lib/settings';
+import useSWR from 'swr';
+import Button from '../Common/Button';
+import axios from 'axios';
+import LibraryItem from './LibraryItem';
+import Badge from '../Common/Badge';
+import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
+
+const messages = defineMessages({
+  jellyfinsettings: 'Jellyfin Settings',
+  jellyfinsettingsDescription:
+    'Configure the settings for your Jellyfin server. Overseerr scans your Jellyfin libraries to see what content is available.',
+  timeout: 'Timeout',
+  save: 'Save Changes',
+  saving: 'Saving…',
+  jellyfinlibraries: 'Jellyfin Libraries',
+  jellyfinlibrariesDescription:
+    'The libraries Overseerr scans for titles. Click the button below if no libraries are listed.',
+  syncing: 'Syncing',
+  syncJellyfin: 'Sync Libraries',
+  manualscanJellyfin: 'Manual Library Scan',
+  manualscanDescriptionJellyfin:
+    "Normally, this will only be run once every 24 hours. Overseerr will check your Jellyfin server's recently added more aggressively. If this is your first time configuring Jellyfin, a one-time full manual library scan is recommended!",
+  notrunning: 'Not Running',
+  currentlibrary: 'Current Library: {name}',
+  librariesRemaining: 'Libraries Remaining: {count}',
+  startscan: 'Start Scan',
+  cancelscan: 'Cancel Scan',
+});
+
+interface Library {
+  id: string;
+  name: string;
+  enabled: boolean;
+}
+
+interface SyncStatus {
+  running: boolean;
+  progress: number;
+  total: number;
+  currentLibrary?: Library;
+  libraries: Library[];
+}
+interface SettingsJellyfinProps {
+  onComplete?: () => void;
+}
+
+const SettingsJellyfin: React.FC<SettingsJellyfinProps> = ({ onComplete }) => {
+  const [isSyncing, setIsSyncing] = useState(false);
+
+  const {
+    data: data,
+    error: error,
+    revalidate: revalidate,
+  } = useSWR<JellyfinSettings>('/api/v1/settings/jellyfin');
+  const { data: dataSync, revalidate: revalidateSync } = useSWR<SyncStatus>(
+    '/api/v1/settings/jellyfin/sync',
+    {
+      refreshInterval: 1000,
+    }
+  );
+  const intl = useIntl();
+
+  const activeLibraries =
+    data?.libraries
+      .filter((library) => library.enabled)
+      .map((library) => library.id) ?? [];
+
+  const syncLibraries = async () => {
+    setIsSyncing(true);
+
+    const params: { sync: boolean; enable?: string } = {
+      sync: true,
+    };
+
+    if (activeLibraries.length > 0) {
+      params.enable = activeLibraries.join(',');
+    }
+
+    await axios.get('/api/v1/settings/jellyfin/library', {
+      params,
+    });
+    setIsSyncing(false);
+    revalidate();
+  };
+
+  const startScan = async () => {
+    await axios.post('/api/v1/settings/jellyfin/sync', {
+      start: true,
+    });
+    revalidateSync();
+  };
+
+  const cancelScan = async () => {
+    await axios.post('/api/v1/settings/jellyfin/sync', {
+      cancel: true,
+    });
+    revalidateSync();
+  };
+
+  const toggleLibrary = async (libraryId: string) => {
+    setIsSyncing(true);
+    if (activeLibraries.includes(libraryId)) {
+      const params: { enable?: string } = {};
+
+      if (activeLibraries.length > 1) {
+        params.enable = activeLibraries
+          .filter((id) => id !== libraryId)
+          .join(',');
+      }
+
+      await axios.get('/api/v1/settings/jellyfin/library', {
+        params,
+      });
+    } else {
+      await axios.get('/api/v1/settings/jellyfin/library', {
+        params: {
+          enable: [...activeLibraries, libraryId].join(','),
+        },
+      });
+    }
+    if (onComplete) {
+      onComplete();
+    }
+    setIsSyncing(false);
+    revalidate();
+  };
+
+  if (!data && !error) {
+    return <LoadingSpinner />;
+  }
+
+  return (
+    <>
+      <div className="mb-6">
+        <h3 className="heading">
+          <FormattedMessage {...messages.jellyfinlibraries} />
+        </h3>
+        <p className="description">
+          <FormattedMessage {...messages.jellyfinlibrariesDescription} />
+        </p>
+      </div>
+      <div className="section">
+        <Button onClick={() => syncLibraries()} disabled={isSyncing}>
+          <svg
+            className={`${isSyncing ? 'animate-spin' : ''} w-5 h-5 mr-1`}
+            fill="currentColor"
+            viewBox="0 0 20 20"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              fillRule="evenodd"
+              d="M4 2a1 1 0 011 1v2.101a7.002 7.002 0 0111.601 2.566 1 1 0 11-1.885.666A5.002 5.002 0 005.999 7H9a1 1 0 010 2H4a1 1 0 01-1-1V3a1 1 0 011-1zm.008 9.057a1 1 0 011.276.61A5.002 5.002 0 0014.001 13H11a1 1 0 110-2h5a1 1 0 011 1v5a1 1 0 11-2 0v-2.101a7.002 7.002 0 01-11.601-2.566 1 1 0 01.61-1.276z"
+              clipRule="evenodd"
+            />
+          </svg>
+          {isSyncing
+            ? intl.formatMessage(messages.syncing)
+            : intl.formatMessage(messages.syncJellyfin)}
+        </Button>
+        <ul className="grid grid-cols-1 gap-5 mt-6 sm:gap-6 sm:grid-cols-2 lg:grid-cols-4">
+          {data?.libraries.map((library) => (
+            <LibraryItem
+              name={library.name}
+              isEnabled={library.enabled}
+              key={`setting-library-${library.id}`}
+              onToggle={() => toggleLibrary(library.id)}
+            />
+          ))}
+        </ul>
+      </div>
+      <div className="mt-10 mb-6">
+        <h3 className="heading">
+          <FormattedMessage {...messages.manualscanJellyfin} />
+        </h3>
+        <p className="description">
+          <FormattedMessage {...messages.manualscanDescriptionJellyfin} />
+        </p>
+      </div>
+      <div className="section">
+        <div className="p-4 bg-gray-800 rounded-md">
+          <div className="relative w-full h-8 mb-6 overflow-hidden bg-gray-600 rounded-full">
+            {dataSync?.running && (
+              <div
+                className="h-8 transition-all duration-200 ease-in-out bg-indigo-600"
+                style={{
+                  width: `${Math.round(
+                    (dataSync.progress / dataSync.total) * 100
+                  )}%`,
+                }}
+              />
+            )}
+            <div className="absolute inset-0 flex items-center justify-center w-full h-8 text-sm">
+              <span>
+                {dataSync?.running
+                  ? `${dataSync.progress} of ${dataSync.total}`
+                  : 'Not running'}
+              </span>
+            </div>
+          </div>
+          <div className="flex flex-col w-full sm:flex-row">
+            {dataSync?.running && (
+              <>
+                {dataSync.currentLibrary && (
+                  <div className="flex items-center mb-2 mr-0 sm:mb-0 sm:mr-2">
+                    <Badge>
+                      <FormattedMessage
+                        {...messages.currentlibrary}
+                        values={{ name: dataSync.currentLibrary.name }}
+                      />
+                    </Badge>
+                  </div>
+                )}
+                <div className="flex items-center">
+                  <Badge badgeType="warning">
+                    <FormattedMessage
+                      {...messages.librariesRemaining}
+                      values={{
+                        count: dataSync.currentLibrary
+                          ? dataSync.libraries.slice(
+                              dataSync.libraries.findIndex(
+                                (library) =>
+                                  library.id === dataSync.currentLibrary?.id
+                              ) + 1
+                            ).length
+                          : 0,
+                      }}
+                    />
+                  </Badge>
+                </div>
+              </>
+            )}
+            <div className="flex-1 text-right">
+              {!dataSync?.running && (
+                <Button buttonType="warning" onClick={() => startScan()}>
+                  <svg
+                    className="w-5 h-5 mr-1"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      strokeLinecap="round"
+                      strokeLinejoin="round"
+                      strokeWidth={2}
+                      d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
+                    />
+                  </svg>
+                  <FormattedMessage {...messages.startscan} />
+                </Button>
+              )}
+
+              {dataSync?.running && (
+                <Button buttonType="danger" onClick={() => cancelScan()}>
+                  <svg
+                    className="w-5 h-5 mr-1"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      strokeLinecap="round"
+                      strokeLinejoin="round"
+                      strokeWidth={2}
+                      d="M6 18L18 6M6 6l12 12"
+                    />
+                  </svg>
+                  <FormattedMessage {...messages.cancelscan} />
+                </Button>
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
+    </>
+  );
+};
+
+export default SettingsJellyfin;

src/components/Settings/SettingsLayout.tsx

@@ -8,6 +8,7 @@ const messages = defineMessages({
   menuGeneralSettings: 'General',
   menuUsers: 'Users',
   menuPlexSettings: 'Plex',
+  menuJellyfinSettings: 'Jellyfin',
   menuServices: 'Services',
   menuNotifications: 'Notifications',
   menuLogs: 'Logs',
@@ -34,6 +35,11 @@ const SettingsLayout: React.FC = ({ children }) => {
       route: '/settings/plex',
       regex: /^\/settings\/plex/,
     },
+    {
+      text: intl.formatMessage(messages.menuJellyfinSettings),
+      route: '/settings/jellyfin',
+      regex: /^\/settings\/jellyfin/,
+    },
     {
       text: intl.formatMessage(messages.menuServices),
       route: '/settings/services',

src/components/Setup/SetupLogin.tsx

@@ -0,0 +1,112 @@
+import React, { useEffect, useState } from 'react';
+import { useUser } from '../../hooks/useUser';
+import PlexLoginButton from '../PlexLoginButton';
+import JellyfinLogin from '../Login/JellyfinLogin';
+import axios from 'axios';
+import { defineMessages, FormattedMessage } from 'react-intl';
+import Accordion from '../Common/Accordion';
+import { MediaServerType } from '../../../server/constants/server';
+
+const messages = defineMessages({
+  welcome: 'Welcome to Overseerr',
+  signinMessage: 'Get started by signing in',
+  signinWithJellyfin: 'Use your Jellyfin account',
+  signinWithPlex: 'Use your Plex account',
+});
+
+interface LoginWithMediaServerProps {
+  onComplete: () => void;
+}
+
+const SetupLogin: React.FC<LoginWithMediaServerProps> = ({ onComplete }) => {
+  const [authToken, setAuthToken] = useState<string | undefined>(undefined);
+  const [mediaServerType, setMediaServerType] = useState<number>(
+    MediaServerType.NOT_CONFIGURED
+  );
+  const { user, revalidate } = useUser();
+
+  // Effect that is triggered when the `authToken` comes back from the Plex OAuth
+  // We take the token and attempt to login. If we get a success message, we will
+  // ask swr to revalidate the user which _shouid_ come back with a valid user.
+
+  useEffect(() => {
+    const login = async () => {
+      const response = await axios.post('/api/v1/auth/plex', {
+        authToken: authToken,
+      });
+
+      if (response.data?.email) {
+        revalidate();
+      }
+    };
+    if (authToken && mediaServerType == MediaServerType.PLEX) {
+      login();
+    }
+  }, [authToken, mediaServerType, revalidate]);
+
+  useEffect(() => {
+    if (user) {
+      onComplete();
+    }
+  }, [user, onComplete]);
+
+  return (
+    <div>
+      <div className="flex justify-center mb-2 text-xl font-bold">
+        <FormattedMessage {...messages.welcome} />
+      </div>
+      <div className="flex justify-center pb-6 mb-2 text-sm">
+        <FormattedMessage {...messages.signinMessage} />
+      </div>
+      <Accordion single atLeastOne>
+        {({ openIndexes, handleClick, AccordionContent }) => (
+          <>
+            <button
+              className={`w-full py-2 text-sm text-center hover:bg-gray-700 hover:cursor-pointer text-gray-400 transition-colors duration-200 bg-gray-900 cursor-default focus:outline-none sm:rounded-t-lg ${
+                openIndexes.includes(0) && 'text-indigo-500'
+              } ${openIndexes.includes(1) && 'border-b border-gray-500'}`}
+              onClick={() => handleClick(0)}
+            >
+              <FormattedMessage {...messages.signinWithPlex} />
+            </button>
+            <AccordionContent isOpen={openIndexes.includes(0)}>
+              <div
+                className="px-10 py-8"
+                style={{ backgroundColor: 'rgba(0,0,0,0.3)' }}
+              >
+                <PlexLoginButton
+                  onAuthToken={(authToken) => {
+                    setMediaServerType(MediaServerType.PLEX);
+                    setAuthToken(authToken);
+                  }}
+                />
+              </div>
+            </AccordionContent>
+            <div>
+              <button
+                className={`w-full py-2 text-sm text-center text-gray-400 transition-colors duration-200 bg-gray-900 cursor-default focus:outline-none hover:bg-gray-700 hover:cursor-pointer ${
+                  openIndexes.includes(1)
+                    ? 'text-indigo-500'
+                    : 'sm:rounded-b-lg'
+                }`}
+                onClick={() => handleClick(1)}
+              >
+                <FormattedMessage {...messages.signinWithJellyfin} />
+              </button>
+              <AccordionContent isOpen={openIndexes.includes(1)}>
+                <div
+                  className="px-10 py-8 rounded-b-lg"
+                  style={{ backgroundColor: 'rgba(0,0,0,0.3)' }}
+                >
+                  <JellyfinLogin initial={true} revalidate={revalidate} />
+                </div>
+              </AccordionContent>
+            </div>
+          </>
+        )}
+      </Accordion>
+    </div>
+  );
+};
+
+export default SetupLogin;

src/components/Setup/index.tsx

@@ -10,9 +10,10 @@ import Button from '../Common/Button';
 import ImageFader from '../Common/ImageFader';
 import PageTitle from '../Common/PageTitle';
 import LanguagePicker from '../Layout/LanguagePicker';
+import SettingsJellyfin from '../Settings/SettingsJellyfin';
 import SettingsPlex from '../Settings/SettingsPlex';
 import SettingsServices from '../Settings/SettingsServices';
-import LoginWithPlex from './LoginWithPlex';
+import SetupLogin from './SetupLogin';
 import SetupSteps from './SetupSteps';
 
 const messages = defineMessages({
@@ -20,8 +21,8 @@ const messages = defineMessages({
   finish: 'Finish Setup',
   finishing: 'Finishing…',
   continue: 'Continue',
-  loginwithplex: 'Sign in with Plex',
-  configureplex: 'Configure Plex',
+  signin: 'Sign In',
+  configuremediaserver: 'Configure Media Server',
   configureservices: 'Configure Services',
   tip: 'Tip',
   scanbackground:
@@ -32,7 +33,9 @@ const Setup: React.FC = () => {
   const intl = useIntl();
   const [isUpdating, setIsUpdating] = useState(false);
   const [currentStep, setCurrentStep] = useState(1);
-  const [plexSettingsComplete, setPlexSettingsComplete] = useState(false);
+  const [mediaServerSettingsComplete, setMediaServerSettingsComplete] =
+    useState(false);
+  const [mediaServerType, setMediaServerType] = useState('');
   const router = useRouter();
   const { locale } = useLocale();
 
@@ -51,6 +54,12 @@ const Setup: React.FC = () => {
     }
   };
 
+  const getMediaServerType = async () => {
+    const MainSettings = await axios.get('/api/v1/settings/main');
+    setMediaServerType(MainSettings.data.mediaServerType);
+    return;
+  };
+
   return (
     <div className="relative flex flex-col justify-center min-h-screen py-12 bg-gray-900">
       <PageTitle title={intl.formatMessage(messages.setup)} />
@@ -81,13 +90,13 @@ const Setup: React.FC = () => {
           >
             <SetupSteps
               stepNumber={1}
-              description={intl.formatMessage(messages.loginwithplex)}
+              description={intl.formatMessage(messages.signin)}
               active={currentStep === 1}
               completed={currentStep > 1}
             />
             <SetupSteps
               stepNumber={2}
-              description={intl.formatMessage(messages.configureplex)}
+              description={intl.formatMessage(messages.configuremediaserver)}
               active={currentStep === 2}
               completed={currentStep > 2}
             />
@@ -99,13 +108,30 @@ const Setup: React.FC = () => {
             />
           </ul>
         </nav>
-        <div className="w-full p-4 mt-10 text-white bg-gray-800 bg-opacity-50 border border-gray-600 rounded-md">
+        <div
+          style={{ backdropFilter: 'blur(5px)' }}
+          className="w-full p-4 mt-10 text-white bg-gray-800 border border-gray-600 rounded-md bg-opacity-40"
+        >
           {currentStep === 1 && (
-            <LoginWithPlex onComplete={() => setCurrentStep(2)} />
+            <SetupLogin
+              onComplete={() => {
+                getMediaServerType().then(() => {
+                  setCurrentStep(2);
+                });
+              }}
+            />
           )}
           {currentStep === 2 && (
             <div>
-              <SettingsPlex onComplete={() => setPlexSettingsComplete(true)} />
+              {mediaServerType == 'PLEX' ? (
+                <SettingsPlex
+                  onComplete={() => setMediaServerSettingsComplete(true)}
+                />
+              ) : (
+                <SettingsJellyfin
+                  onComplete={() => setMediaServerSettingsComplete(true)}
+                />
+              )}
               <div className="mt-4 text-sm text-gray-500">
                 <span className="mr-2">
                   <Badge>{intl.formatMessage(messages.tip)}</Badge>
@@ -117,7 +143,7 @@ const Setup: React.FC = () => {
                   <span className="inline-flex ml-3 rounded-md shadow-sm">
                     <Button
                       buttonType="primary"
-                      disabled={!plexSettingsComplete}
+                      disabled={!mediaServerSettingsComplete}
                       onClick={() => setCurrentStep(3)}
                     >
                       {intl.formatMessage(messages.continue)}

src/components/StatusBadge/index.tsx

@@ -13,25 +13,25 @@ interface StatusBadgeProps {
   status?: MediaStatus;
   is4k?: boolean;
   inProgress?: boolean;
-  plexUrl?: string;
-  plexUrl4k?: string;
+  mediaUrl?: string;
+  mediaUrl4k?: string;
 }
 
 const StatusBadge: React.FC<StatusBadgeProps> = ({
   status,
   is4k = false,
   inProgress = false,
-  plexUrl,
-  plexUrl4k,
+  mediaUrl,
+  mediaUrl4k,
 }) => {
   const intl = useIntl();
 
   if (is4k) {
     switch (status) {
       case MediaStatus.AVAILABLE:
-        if (plexUrl4k) {
+        if (mediaUrl4k) {
           return (
-            <a href={plexUrl4k} target="_blank" rel="noopener noreferrer">
+            <a href={mediaUrl4k} target="_blank" rel="noopener noreferrer">
               <Badge
                 badgeType="success"
                 className="transition !cursor-pointer hover:bg-green-400"
@@ -52,9 +52,9 @@ const StatusBadge: React.FC<StatusBadgeProps> = ({
           </Badge>
         );
       case MediaStatus.PARTIALLY_AVAILABLE:
-        if (plexUrl4k) {
+        if (mediaUrl4k) {
           return (
-            <a href={plexUrl4k} target="_blank" rel="noopener noreferrer">
+            <a href={mediaUrl4k} target="_blank" rel="noopener noreferrer">
               <Badge
                 badgeType="success"
                 className="transition !cursor-pointer hover:bg-green-400"
@@ -104,9 +104,9 @@ const StatusBadge: React.FC<StatusBadgeProps> = ({
 
   switch (status) {
     case MediaStatus.AVAILABLE:
-      if (plexUrl) {
+      if (mediaUrl) {
         return (
-          <a href={plexUrl} target="_blank" rel="noopener noreferrer">
+          <a href={mediaUrl} target="_blank" rel="noopener noreferrer">
             <Badge
               badgeType="success"
               className="transition !cursor-pointer hover:bg-green-400"
@@ -129,9 +129,9 @@ const StatusBadge: React.FC<StatusBadgeProps> = ({
         </Badge>
       );
     case MediaStatus.PARTIALLY_AVAILABLE:
-      if (plexUrl) {
+      if (mediaUrl) {
         return (
-          <a href={plexUrl} target="_blank" rel="noopener noreferrer">
+          <a href={mediaUrl} target="_blank" rel="noopener noreferrer">
             <Badge
               badgeType="success"
               className="transition !cursor-pointer hover:bg-green-400"

src/components/StatusChacker/index.tsx

@@ -1,20 +1,8 @@
-import { SparklesIcon } from '@heroicons/react/outline';
 import React from 'react';
-import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
 import { StatusResponse } from '../../../server/interfaces/api/settingsInterfaces';
-import Modal from '../Common/Modal';
-import Transition from '../Transition';
-
-const messages = defineMessages({
-  newversionavailable: 'Application Update',
-  newversionDescription:
-    'Overseerr has been updated! Please click the button below to reload the page.',
-  reloadOverseerr: 'Reload',
-});
 
 const StatusChecker: React.FC = () => {
-  const intl = useIntl();
   const { data, error } = useSWR<StatusResponse>('/api/v1/status', {
     refreshInterval: 60 * 1000,
   });
@@ -27,28 +15,7 @@ const StatusChecker: React.FC = () => {
     return null;
   }
 
-  return (
-    <Transition
-      enter="opacity-0 transition duration-300"
-      enterFrom="opacity-0"
-      enterTo="opacity-100"
-      leave="opacity-100 transition duration-300"
-      leaveFrom="opacity-100"
-      leaveTo="opacity-0"
-      appear
-      show={data.commitTag !== process.env.commitTag}
-    >
-      <Modal
-        iconSvg={<SparklesIcon />}
-        title={intl.formatMessage(messages.newversionavailable)}
-        onOk={() => location.reload()}
-        okText={intl.formatMessage(messages.reloadOverseerr)}
-        backgroundClickable={false}
-      >
-        {intl.formatMessage(messages.newversionDescription)}
-      </Modal>
-    </Transition>
-  );
+  return null;
 };
 
 export default StatusChecker;

src/components/TvDetails/index.tsx

@@ -18,6 +18,7 @@ import useSWR from 'swr';
 import type { RTRating } from '../../../server/api/rottentomatoes';
 import { ANIME_KEYWORD_ID } from '../../../server/api/themoviedb/constants';
 import { MediaStatus } from '../../../server/constants/media';
+import { MediaServerType } from '../../../server/constants/server';
 import { Crew } from '../../../server/models/common';
 import { TvDetails as TvDetailsType } from '../../../server/models/Tv';
 import RTAudFresh from '../../assets/rt_aud_fresh.svg';
@@ -72,8 +73,8 @@ const messages = defineMessages({
   opensonarr: 'Open Series in Sonarr',
   opensonarr4k: 'Open Series in 4K Sonarr',
   downloadstatus: 'Download Status',
-  playonplex: 'Play on Plex',
-  play4konplex: 'Play in 4K on Plex',
+  play: 'Play on {mediaServerName}',
+  play4k: 'Play 4K on {mediaServerName}',
   markavailable: 'Mark as Available',
   mark4kavailable: 'Mark as Available in 4K',
   allseasonsmarkedavailable: '* All seasons will be marked as available.',
@@ -122,23 +123,29 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
 
   const mediaLinks: PlayButtonLink[] = [];
 
-  if (data.mediaInfo?.plexUrl) {
+  if (data.mediaInfo?.mediaUrl) {
     mediaLinks.push({
-      text: intl.formatMessage(messages.playonplex),
-      url: data.mediaInfo?.plexUrl,
+      text:
+        settings.currentSettings.mediaServerType === MediaServerType.JELLYFIN
+          ? intl.formatMessage(messages.play, { mediaServerName: 'Jellyfin' })
+          : intl.formatMessage(messages.play, { mediaServerName: 'Plex' }),
+      url: data.mediaInfo?.mediaUrl,
       svg: <PlayIcon />,
     });
   }
 
   if (
-    data.mediaInfo?.plexUrl4k &&
+    data.mediaInfo?.mediaUrl4k &&
     hasPermission([Permission.REQUEST_4K, Permission.REQUEST_4K_TV], {
       type: 'or',
     })
   ) {
     mediaLinks.push({
-      text: intl.formatMessage(messages.play4konplex),
-      url: data.mediaInfo?.plexUrl4k,
+      text:
+        settings.currentSettings.mediaServerType === MediaServerType.JELLYFIN
+          ? intl.formatMessage(messages.play4k, { mediaServerName: 'Jellyfin' })
+          : intl.formatMessage(messages.play4k, { mediaServerName: 'Plex' }),
+      url: data.mediaInfo?.mediaUrl4k,
       svg: <PlayIcon />,
     });
   }
@@ -434,7 +441,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
             <StatusBadge
               status={data.mediaInfo?.status}
               inProgress={(data.mediaInfo?.downloadStatus ?? []).length > 0}
-              plexUrl={data.mediaInfo?.plexUrl}
+              mediaUrl={data.mediaInfo?.mediaUrl}
             />
             {settings.currentSettings.series4kEnabled &&
               hasPermission([Permission.REQUEST_4K, Permission.REQUEST_4K_TV], {
@@ -446,7 +453,7 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
                   inProgress={
                     (data.mediaInfo?.downloadStatus4k ?? []).length > 0
                   }
-                  plexUrl4k={data.mediaInfo?.plexUrl4k}
+                  mediaUrl4k={data.mediaInfo?.mediaUrl4k}
                 />
               )}
           </div>
@@ -689,7 +696,9 @@ const TvDetails: React.FC<TvDetailsProps> = ({ tv }) => {
                 tvdbId={data.externalIds.tvdbId}
                 imdbId={data.externalIds.imdbId}
                 rtUrl={ratingData?.url}
-                plexUrl={data.mediaInfo?.plexUrl ?? data.mediaInfo?.plexUrl4k}
+                mediaUrl={
+                  data.mediaInfo?.mediaUrl ?? data.mediaInfo?.mediaUrl4k
+                }
               />
             </div>
           </div>

src/components/UserList/index.tsx

@@ -2,7 +2,6 @@ import { TrashIcon } from '@heroicons/react/outline';
 import {
   ChevronLeftIcon,
   ChevronRightIcon,
-  InboxInIcon,
   PencilIcon,
   SortDescendingIcon,
   UserAddIcon,
@@ -16,6 +15,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
 import * as Yup from 'yup';
+import { MediaServerType } from '../../../server/constants/server';
 import type { UserResultsResponse } from '../../../server/interfaces/api/userInterfaces';
 import { hasPermission } from '../../../server/lib/permissions';
 import useSettings from '../../hooks/useSettings';
@@ -495,15 +495,17 @@ const UserList: React.FC = () => {
               <UserAddIcon />
               <span>{intl.formatMessage(messages.createlocaluser)}</span>
             </Button>
-            <Button
-              className="flex-grow outline lg:mr-2"
-              buttonType="primary"
-              disabled={isImporting}
-              onClick={() => importFromPlex()}
-            >
-              <InboxInIcon />
-              <span>{intl.formatMessage(messages.importfromplex)}</span>
-            </Button>
+            {settings.currentSettings.mediaServerType ==
+              MediaServerType.PLEX && (
+              <Button
+                className="flex-grow outline lg:mr-2"
+                buttonType="primary"
+                disabled={isImporting}
+                onClick={() => importFromPlex()}
+              >
+                {intl.formatMessage(messages.importfromplex)}
+              </Button>
+            )}
           </div>
           <div className="flex flex-grow mb-2 lg:mb-0 lg:flex-grow-0">
             <span className="inline-flex items-center px-3 text-sm text-gray-100 bg-gray-800 border border-r-0 border-gray-500 cursor-default rounded-l-md">

src/components/UserProfile/UserSettings/UserGeneralSettings/index.tsx

@@ -6,6 +6,7 @@ import React, { useEffect, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { useToasts } from 'react-toast-notifications';
 import useSWR from 'swr';
+import { MediaServerType } from '../../../../../server/constants/server';
 import { UserSettingsGeneralResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import {
   availableLanguages,
@@ -28,6 +29,9 @@ const messages = defineMessages({
   general: 'General',
   generalsettings: 'General Settings',
   displayName: 'Display Name',
+  save: 'Save Changes',
+  saving: 'Saving…',
+  mediaServerUser: '{mediaServerName} User',
   accounttype: 'Account Type',
   plexuser: 'Plex User',
   localuser: 'Local User',
@@ -50,6 +54,7 @@ const messages = defineMessages({
 
 const UserGeneralSettings: React.FC = () => {
   const intl = useIntl();
+  const settings = useSettings();
   const { addToast } = useToasts();
   const { locale, setLocale } = useLocale();
   const [movieQuotaEnabled, setMovieQuotaEnabled] = useState(false);
@@ -153,13 +158,19 @@ const UserGeneralSettings: React.FC = () => {
                 </label>
                 <div className="mb-1 text-sm font-medium leading-5 text-gray-400 sm:mt-2">
                   <div className="flex items-center max-w-lg">
-                    {user?.userType === UserType.PLEX ? (
+                    {user?.userType === UserType.LOCAL ? (
                       <Badge badgeType="warning">
-                        {intl.formatMessage(messages.plexuser)}
+                        {intl.formatMessage(messages.localuser)}
                       </Badge>
                     ) : (
                       <Badge badgeType="default">
-                        {intl.formatMessage(messages.localuser)}
+                        {intl.formatMessage(messages.mediaServerUser, {
+                          mediaServerName:
+                            settings.currentSettings.mediaServerType ===
+                            MediaServerType.PLEX
+                              ? 'Plex'
+                              : 'Jellyfin',
+                        })}
                       </Badge>
                     )}
                   </div>

src/context/SettingsContext.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import useSWR from 'swr';
+import { MediaServerType } from '../../server/constants/server';
 import { PublicSettingsResponse } from '../../server/interfaces/api/settingsInterfaces';
 
 export interface SettingsContextProps {
@@ -16,6 +17,7 @@ const defaultSettings = {
   series4kEnabled: false,
   region: '',
   originalLanguage: '',
+  mediaServerType: MediaServerType.NOT_CONFIGURED,
   partialRequestsEnabled: true,
   cacheImages: false,
   vapidPublic: '',

src/hooks/useVerticalScroll.ts

@@ -17,8 +17,9 @@ const useVerticalScroll = (
   const [isScrolling, setScrolling] = useState(false);
 
   type SetTimeoutReturnType = ReturnType<typeof setTimeout>;
-  const scrollingTimer: MutableRefObject<SetTimeoutReturnType | undefined> =
-    useRef();
+  const scrollingTimer: MutableRefObject<
+    SetTimeoutReturnType | undefined
+  > = useRef();
 
   const runCallback = () => {
     if (shouldFetch) {

src/i18n/locale/en.json

@@ -43,21 +43,38 @@
   "components.Layout.UserDropdown.myprofile": "Profile",
   "components.Layout.UserDropdown.settings": "Settings",
   "components.Layout.UserDropdown.signout": "Sign Out",
+  "components.Layout.alphawarning": "This is ALPHA software. Features may be broken and/or unstable. Please report issues on GitHub!",
+  "components.Login.credentialerror": "The username or password is incorrect.",
+  "components.Login.description": "Since this is your first time logging into {applicationName}, you are required to add a valid email address.",
   "components.Layout.VersionStatus.commitsbehind": "{commitsBehind} {commitsBehind, plural, one {commit} other {commits}} behind",
   "components.Layout.VersionStatus.outofdate": "Out of Date",
   "components.Layout.VersionStatus.streamdevelop": "Overseerr Develop",
   "components.Layout.VersionStatus.streamstable": "Overseerr Stable",
   "components.Login.email": "Email Address",
   "components.Login.forgotpassword": "Forgot Password?",
+  "components.Login.host": "Jellyfin URL",
+  "components.Login.initialsignin": "Connect",
+  "components.Login.initialsigningin": "Connecting…",
   "components.Login.loginerror": "Something went wrong while trying to sign in.",
   "components.Login.password": "Password",
+  "components.Login.save": "Add",
+  "components.Login.saving": "Adding…",
   "components.Login.signin": "Sign In",
   "components.Login.signingin": "Signing In…",
   "components.Login.signinheader": "Sign in to continue",
+  "components.Login.signinwithjellyfin": "Use your Jellyfin account",
   "components.Login.signinwithoverseerr": "Use your {applicationTitle} account",
   "components.Login.signinwithplex": "Use your Plex account",
+  "components.Login.title": "Add Email",
+  "components.Login.username": "Username",
+  "components.Login.validationEmailFormat": "Invalid email",
+  "components.Login.validationEmailRequired": "You must provide an email",
+  "components.Login.validationemailformat": "Valid email required",
   "components.Login.validationemailrequired": "You must provide a valid email address",
+  "components.Login.validationhostformat": "Valid URL required",
+  "components.Login.validationhostrequired": "Jellyfin URL required",
   "components.Login.validationpasswordrequired": "You must provide a password",
+  "components.Login.validationusernamerequired": "Username required",
   "components.MediaSlider.ShowMoreCard.seemore": "See More",
   "components.MovieDetails.MovieCast.fullcast": "Full Cast",
   "components.MovieDetails.MovieCrew.fullcrew": "Full Crew",
@@ -77,8 +94,9 @@
   "components.MovieDetails.originaltitle": "Original Title",
   "components.MovieDetails.overview": "Overview",
   "components.MovieDetails.overviewunavailable": "Overview unavailable.",
-  "components.MovieDetails.play4konplex": "Play in 4K on Plex",
-  "components.MovieDetails.playonplex": "Play on Plex",
+  "components.MovieDetails.pending": "Pending",
+  "components.MovieDetails.play": "Play on {mediaServerName}",
+  "components.MovieDetails.play4k": "Play 4K on {mediaServerName}",
   "components.MovieDetails.recommendations": "Recommendations",
   "components.MovieDetails.releasedate": "Release Date",
   "components.MovieDetails.revenue": "Revenue",
@@ -148,8 +166,10 @@
   "components.PersonDetails.alsoknownas": "Also Known As: {names}",
   "components.PersonDetails.appearsin": "Appearances",
   "components.PersonDetails.ascharacter": "as {character}",
+  "components.PersonDetails.crewmember": "Crew Member",
+  "components.PersonDetails.nobiography": "No biography available.",
+  "components.PlexLoginButton.loading": "Loading…",
   "components.PersonDetails.birthdate": "Born {birthdate}",
-  "components.PersonDetails.crewmember": "Crew",
   "components.PersonDetails.lifespan": "{birthdate} – {deathdate}",
   "components.PlexLoginButton.signingin": "Signing In…",
   "components.PlexLoginButton.signinwithplex": "Sign In",
@@ -584,16 +604,23 @@
   "components.Settings.generalsettings": "General Settings",
   "components.Settings.generalsettingsDescription": "Configure global and default settings for Overseerr.",
   "components.Settings.hideAvailable": "Hide Available Media",
+  "components.Settings.jellyfinlibraries": "Jellyfin Libraries",
+  "components.Settings.jellyfinlibrariesDescription": "The libraries Overseerr scans for titles. Click the button below if no libraries are listed.",
+  "components.Settings.jellyfinsettings": "Jellyfin Settings",
+  "components.Settings.jellyfinsettingsDescription": "Configure the settings for your Jellyfin server. Overseerr scans your Jellyfin libraries to see what content is available.",
   "components.Settings.hostname": "Hostname or IP Address",
   "components.Settings.is4k": "4K",
   "components.Settings.librariesRemaining": "Libraries Remaining: {count}",
   "components.Settings.locale": "Display Language",
   "components.Settings.manualscan": "Manual Library Scan",
   "components.Settings.manualscanDescription": "Normally, this will only be run once every 24 hours. Overseerr will check your Plex server's recently added more aggressively. If this is your first time configuring Plex, a one-time full manual library scan is recommended!",
+  "components.Settings.manualscanDescriptionJellyfin": "Normally, this will only be run once every 24 hours. Overseerr will check your Jellyfin server's recently added more aggressively. If this is your first time configuring Jellyfin, a one-time full manual library scan is recommended!",
+  "components.Settings.manualscanJellyfin": "Manual Library Scan",
+  "components.Settings.menuGeneralSettings": "General Settings",
+  "components.Settings.menuJellyfinSettings": "Jellyfin",
   "components.Settings.mediaTypeMovie": "movie",
   "components.Settings.mediaTypeSeries": "series",
   "components.Settings.menuAbout": "About",
-  "components.Settings.menuGeneralSettings": "General",
   "components.Settings.menuJobs": "Jobs & Cache",
   "components.Settings.menuLogs": "Logs",
   "components.Settings.menuNotifications": "Notifications",
@@ -634,6 +661,10 @@
   "components.Settings.sonarrsettings": "Sonarr Settings",
   "components.Settings.ssl": "SSL",
   "components.Settings.startscan": "Start Scan",
+  "components.Settings.sync": "Sync Plex Libraries",
+  "components.Settings.syncJellyfin": "Sync Libraries",
+  "components.Settings.syncing": "Syncing…",
+  "components.Settings.timeout": "Timeout",
   "components.Settings.toastApiKeyFailure": "Something went wrong while generating a new API key.",
   "components.Settings.toastApiKeySuccess": "New API key generated successfully!",
   "components.Settings.toastPlexConnecting": "Attempting to connect to Plex…",
@@ -655,16 +686,21 @@
   "components.Settings.webAppUrl": "<WebAppLink>Web App</WebAppLink> URL",
   "components.Settings.webAppUrlTip": "Optionally direct users to the web app on your server instead of the \"hosted\" web app",
   "components.Settings.webhook": "Webhook",
+  "components.Setup.configuremediaserver": "Configure Media Server",
   "components.Settings.webpush": "Web Push",
   "components.Setup.configureplex": "Configure Plex",
   "components.Setup.configureservices": "Configure Services",
   "components.Setup.continue": "Continue",
   "components.Setup.finish": "Finish Setup",
   "components.Setup.finishing": "Finishing…",
+  "components.Setup.signin": "Sign In",
+  "components.Setup.signinMessage": "Get started by signing in",
+  "components.Setup.signinWithJellyfin": "Use your Jellyfin account",
+  "components.Setup.signinWithPlex": "Use your Plex account",
+  "components.Setup.syncingbackground": "Syncing will run in the background. You can continue the setup process in the meantime.",
   "components.Setup.loginwithplex": "Sign in with Plex",
   "components.Setup.scanbackground": "Scanning will run in the background. You can continue the setup process in the meantime.",
   "components.Setup.setup": "Setup",
-  "components.Setup.signinMessage": "Get started by signing in with your Plex account",
   "components.Setup.tip": "Tip",
   "components.Setup.welcome": "Welcome to Overseerr",
   "components.StatusBadge.status4k": "4K {status}",
@@ -695,6 +731,9 @@
   "components.TvDetails.originaltitle": "Original Title",
   "components.TvDetails.overview": "Overview",
   "components.TvDetails.overviewunavailable": "Overview unavailable.",
+  "components.TvDetails.pending": "Pending",
+  "components.TvDetails.play": "Play on {mediaServerName}",
+  "components.TvDetails.play4k": "Play 4K on {mediaServerName}",
   "components.TvDetails.play4konplex": "Play in 4K on Plex",
   "components.TvDetails.playonplex": "Play on Plex",
   "components.TvDetails.recommendations": "Recommendations",
@@ -760,9 +799,11 @@
   "components.UserProfile.UserSettings.UserGeneralSettings.generalsettings": "General Settings",
   "components.UserProfile.UserSettings.UserGeneralSettings.languageDefault": "Default ({language})",
   "components.UserProfile.UserSettings.UserGeneralSettings.localuser": "Local User",
+  "components.UserProfile.UserSettings.UserGeneralSettings.mediaServerUser": "{mediaServerName} User",
+  "components.UserProfile.UserSettings.UserGeneralSettings.originalLanguageDefault": "All Languages",
+  "components.UserProfile.UserSettings.UserGeneralSettings.originallanguageTip": "Filter content by original language (only applies to the \"Popular\" and \"Upcoming\" categories)",
   "components.UserProfile.UserSettings.UserGeneralSettings.movierequestlimit": "Movie Request Limit",
   "components.UserProfile.UserSettings.UserGeneralSettings.originallanguage": "Discover Language",
-  "components.UserProfile.UserSettings.UserGeneralSettings.originallanguageTip": "Filter content by original language",
   "components.UserProfile.UserSettings.UserGeneralSettings.owner": "Owner",
   "components.UserProfile.UserSettings.UserGeneralSettings.plexuser": "Plex User",
   "components.UserProfile.UserSettings.UserGeneralSettings.region": "Discover Region",

src/pages/_app.tsx

@@ -5,6 +5,7 @@ import React, { useEffect, useState } from 'react';
 import { IntlProvider } from 'react-intl';
 import { ToastProvider } from 'react-toast-notifications';
 import { SWRConfig } from 'swr';
+import { MediaServerType } from '../../server/constants/server';
 import { PublicSettingsResponse } from '../../server/interfaces/api/settingsInterfaces';
 import Layout from '../components/Layout';
 import LoadingBar from '../components/LoadingBar';
@@ -157,6 +158,7 @@ CoreApp.getInitialProps = async (initialProps) => {
     localLogin: true,
     region: '',
     originalLanguage: '',
+    mediaServerType: MediaServerType.NOT_CONFIGURED,
     partialRequestsEnabled: true,
     cacheImages: false,
     vapidPublic: '',

src/pages/settings/jellyfin.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { NextPage } from 'next';
+import SettingsLayout from '../../components/Settings/SettingsLayout';
+import SettingsJellyfin from '../../components/Settings/SettingsJellyfin';
+import { Permission } from '../../hooks/useUser';
+import useRouteGuard from '../../hooks/useRouteGuard';
+
+const JellyfinSettingsPage: NextPage = () => {
+  useRouteGuard(Permission.MANAGE_SETTINGS);
+  return (
+    <SettingsLayout>
+      <SettingsJellyfin />
+    </SettingsLayout>
+  );
+};
+
+export default JellyfinSettingsPage;

src/styles/globals.css

@@ -47,10 +47,19 @@ body {
   background-color: #cc7b19;
 }
 
+.jellyfin-button {
+  @apply flex justify-center w-full px-4 py-2 text-sm font-medium text-center text-white transition duration-150 ease-in-out bg-indigo-600 border border-transparent rounded-md disabled:opacity-50;
+  background-color: #0083b0;
+}
+
 .plex-button:hover {
   background: #f19a30;
 }
 
+.jellyfin-button:hover {
+  background: #00a4dc;
+}
+
 ul.cards-vertical,
 ul.cards-horizontal {
   @apply grid gap-4;

src/utils/jellyfin.ts

@@ -0,0 +1,50 @@
+import axios, { AxiosError, AxiosResponse } from 'axios';
+
+interface JellyfinAuthenticationResult {
+  Id: string;
+  AccessToken: string;
+  ServerId: string;
+}
+
+class JellyAPI {
+  public login(
+    Hostname?: string,
+    Username?: string,
+    Password?: string
+  ): Promise<JellyfinAuthenticationResult> {
+    return new Promise(
+      (
+        resolve: (result: JellyfinAuthenticationResult) => void,
+        reject: (e: Error) => void
+      ) => {
+        axios
+          .post(
+            Hostname + '/Users/AuthenticateByName',
+            {
+              Username: Username,
+              Pw: Password,
+            },
+            {
+              headers: {
+                'X-Emby-Authorization':
+                  'MediaBrowser Client="Jellyfin Web", Device="Firefox", DeviceId="TW96aWxsYS81LjAgKFdpbmRvd3MgTlQgMTAuMDsgV2luNjQ7IHg2NDsgcnY6ODUuMCkgR2Vja28vMjAxMDAxMDEgRmlyZWZveC84NS4wfDE2MTI5MjcyMDM5NzM1", Version="10.8.0"',
+              },
+            }
+          )
+          .then((resp: AxiosResponse) => {
+            const response: JellyfinAuthenticationResult = {
+              Id: resp.data.User.Id,
+              AccessToken: resp.data.AccessToken,
+              ServerId: resp.data.ServerId,
+            };
+            resolve(response);
+          })
+          .catch((e: AxiosError) => {
+            reject(e);
+          });
+      }
+    );
+  }
+}
+
+export default JellyAPI;

src/utils/plex.ts

@@ -85,13 +85,15 @@ class PlexOAuth {
       'context[device][product]': this.plexHeaders['X-Plex-Product'],
       'context[device][version]': this.plexHeaders['X-Plex-Version'],
       'context[device][platform]': this.plexHeaders['X-Plex-Platform'],
-      'context[device][platformVersion]':
-        this.plexHeaders['X-Plex-Platform-Version'],
+      'context[device][platformVersion]': this.plexHeaders[
+        'X-Plex-Platform-Version'
+      ],
       'context[device][device]': this.plexHeaders['X-Plex-Device'],
       'context[device][deviceName]': this.plexHeaders['X-Plex-Device-Name'],
       'context[device][model]': this.plexHeaders['X-Plex-Model'],
-      'context[device][screenResolution]':
-        this.plexHeaders['X-Plex-Device-Screen-Resolution'],
+      'context[device][screenResolution]': this.plexHeaders[
+        'X-Plex-Device-Screen-Resolution'
+      ],
       'context[device][layout]': 'desktop',
       code: this.pin.code,
     };

yarn.lock

@@ -1557,6 +1557,14 @@
     tslib "^2.0.1"
     typescript "^4.0"
 
+"@fullhuman/postcss-purgecss@3.0.0":
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@fullhuman/postcss-purgecss/-/postcss-purgecss-3.0.0.tgz#e39bf7a7d2a2c664ed151b639785b2efcbca33ff"
+  integrity sha512-cvuOgMwIVlfgWcUMqg5p33NbGUxLwMrKtDKkm3QRfOo4PRVNR6+y/xd9OyXTVZiB1bIpKNJ0ZObYPWD3DRQDtw==
+  dependencies:
+    postcss "7.0.32"
+    purgecss "^3.0.0"
+
 "@gar/promisify@^1.0.1":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.2.tgz#30aa825f11d438671d585bd44e7fd564535fc210"
@@ -2010,6 +2018,23 @@
     "@octokit/openapi-types" "^1.2.0"
     "@types/node" ">= 8"
 
+"@prisma/client@^3.11.1":
+  version "3.11.1"
+  resolved "https://registry.yarnpkg.com/@prisma/client/-/client-3.11.1.tgz#bde6dec71ae133d04ce1c6658e3d76627a3c6dc7"
+  integrity sha512-B3C7zQG4HbjJzUr2Zg9UVkBJutbqq9/uqkl1S138+keZCubJrwizx3RuIvGwI+s+pm3qbsyNqXiZgL3Ir0fSng==
+  dependencies:
+    "@prisma/engines-version" "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
+
+"@prisma/engines-version@3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9":
+  version "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
+  resolved "https://registry.yarnpkg.com/@prisma/engines-version/-/engines-version-3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9.tgz#81a1835b495ad287ad7824dbd62f74e9eee90fb9"
+  integrity sha512-HkcsDniA4iNb/gi0iuyOJNAM7nD/LwQ0uJm15v360O5dee3TM4lWdSQiTYBMK6FF68ACUItmzSur7oYuUZ2zkQ==
+
+"@prisma/engines@3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9":
+  version "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
+  resolved "https://registry.yarnpkg.com/@prisma/engines/-/engines-3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9.tgz#09ac23f8f615a8586d8d44538060ada199fe872c"
+  integrity sha512-MILbsGnvmnhCbFGa2/iSnsyGyazU3afzD7ldjCIeLIGKkNBMSZgA2IvpYsAXl+6qFHKGrS3B2otKfV31dwMSQw==
+
 "@react-spring/animated@~9.2.0":
   version "9.2.0"
   resolved "https://registry.yarnpkg.com/@react-spring/animated/-/animated-9.2.0.tgz#02ea2a75c3b1557c9878f248227451119a9eb874"
@@ -2826,6 +2851,11 @@
   resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.3.tgz#9c088679876f374eb5983f150d4787aa6fb32d7e"
   integrity sha512-FvUupuM3rlRsRtCN+fDudtmytGO6iHJuuRKS1Ss0pG5z8oX0diNEw94UEL7hgDbpN94rgaK5R7sWm6RrSkZuAQ==
 
+"@types/uuid@^8.3.1":
+  version "8.3.1"
+  resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-8.3.1.tgz#1a32969cf8f0364b3d8c8af9cc3555b7805df14f"
+  integrity sha512-Y2mHTRAbqfFkpjldbkHGY8JIzRN6XqYRliG8/24FcHm2D2PwW24fl5xMRTVGdrb7iMrwCaIEbLWerGIkXuFWVg==
+
 "@types/web-push@^3.3.2":
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/@types/web-push/-/web-push-3.3.2.tgz#8c32434147c0396415862e86405c9edc9c50fc15"
@@ -4464,16 +4494,16 @@ color@^4.0.1:
     color-convert "^2.0.1"
     color-string "^1.6.0"
 
+colorette@^1.2.1, colorette@^1.3.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.4.0.tgz#5190fbb87276259a86ad700bff2c6d6faa3fca40"
+  integrity sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g==
+
 colorette@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.2.tgz#cbcc79d5e99caea2dbf10eb3a26fd8b3e6acfa94"
   integrity sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==
 
-colorette@^1.3.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.4.0.tgz#5190fbb87276259a86ad700bff2c6d6faa3fca40"
-  integrity sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g==
-
 colors@1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/colors/-/colors-1.0.3.tgz#0433f44d809680fdeb60ed260f1b0c262e82a40b"
@@ -9688,6 +9718,11 @@ nanoclone@^0.2.1:
   resolved "https://registry.yarnpkg.com/nanoclone/-/nanoclone-0.2.1.tgz#dd4090f8f1a110d26bb32c49ed2f5b9235209ed4"
   integrity sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA==
 
+nanoid@^3.1.20:
+  version "3.1.28"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.28.tgz#3c01bac14cb6c5680569014cc65a2f26424c6bd4"
+  integrity sha512-gSu9VZ2HtmoKYe/lmyPFES5nknFrHa+/DT9muUFWFMi6Jh9E1I7bkvlQ8xxf1Kos9pi9o8lBnIOkatMhKX/YUw==
+
 nanoid@^3.1.23:
   version "3.1.23"
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.23.tgz#f744086ce7c2bc47ee0a8472574d5c78e4183a81"
@@ -10291,12 +10326,7 @@ object-hash@^2.2.0:
   resolved "https://registry.yarnpkg.com/object-hash/-/object-hash-2.2.0.tgz#5ad518581eefc443bd763472b8ff2e9c2c0d54a5"
   integrity sha512-gScRMn0bS5fH+IuwyIFgnh9zBdo4DV+6GhygmWM9HyNJSgS0hScp1f5vjtm7oIIOiT9trXrShAkLFSc2IqKNgw==
 
-object-inspect@^1.10.3:
-  version "1.10.3"
-  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.10.3.tgz#c2aa7d2d09f50c99375704f7a0adf24c5782d369"
-  integrity sha512-e5mCJlSH7poANfC8z8S9s9S2IN5/4Zb3aZ33f5s8YqoazCFzNLloLU8r5VCG+G7WoqLvAAZoVMcy3tp/3X0Plw==
-
-object-inspect@^1.11.0:
+object-inspect@^1.10.3, object-inspect@^1.11.0:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.11.0.tgz#9dceb146cedd4148a0d9e51ab88d34cf509922b1"
   integrity sha512-jp7ikS6Sd3GxQfZJPyH3cjcbJF6GZPClgdV+EFygjFLQ5FmW/dRUnTd9PQ9k0JhoNDabWFbpF1yCdSWCC6gexg==
@@ -11002,7 +11032,16 @@ postcss-value-parser@^4.1.0:
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.1.0.tgz#443f6a20ced6481a2bda4fa8532a6e55d789a2cb"
   integrity sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==
 
-postcss@8.2.15, postcss@^8.1.6, postcss@^8.2.1:
+postcss@7.0.32:
+  version "7.0.32"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.32.tgz#4310d6ee347053da3433db2be492883d62cec59d"
+  integrity sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==
+  dependencies:
+    chalk "^2.4.2"
+    source-map "^0.6.1"
+    supports-color "^6.1.0"
+
+postcss@8.2.15, postcss@^8.1.6:
   version "8.2.15"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.2.15.tgz#9e66ccf07292817d226fc315cbbf9bc148fbca65"
   integrity sha512-2zO3b26eJD/8rb106Qu2o7Qgg52ND5HPjcyQiK2B98O388h43A448LCslC0dI2P97wCAQRJsFvwTRcXxTKds+Q==
@@ -11011,6 +11050,15 @@ postcss@8.2.15, postcss@^8.1.6, postcss@^8.2.1:
     nanoid "^3.1.23"
     source-map "^0.6.1"
 
+postcss@^8.2.1:
+  version "8.2.6"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.2.6.tgz#5d69a974543b45f87e464bc4c3e392a97d6be9fe"
+  integrity sha512-xpB8qYxgPuly166AGlpRjUdEYtmOWx2iCwGmrv4vqZL9YPVviDVPZPRXxnXr6xPZOdxQ9lp3ZBFCRgWJ7LE3Sg==
+  dependencies:
+    colorette "^1.2.1"
+    nanoid "^3.1.20"
+    source-map "^0.6.1"
+
 postcss@^8.3.6:
   version "8.3.6"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.3.6.tgz#2730dd76a97969f37f53b9a6096197be311cc4ea"
@@ -11060,6 +11108,13 @@ preview-email@^3.0.5:
     pug "^3.0.2"
     uuid "^8.3.2"
 
+prisma@^3.11.1:
+  version "3.11.1"
+  resolved "https://registry.yarnpkg.com/prisma/-/prisma-3.11.1.tgz#fff9c0bcf83cb30c2e1d650882d5eb3c5565e028"
+  integrity sha512-aYn8bQwt1xwR2oSsVNHT4PXU7EhsThIwmpNB/MNUaaMx5OPLTro6VdNJe/sJssXFLxhamfWeMjwmpXjljo6xkg==
+  dependencies:
+    "@prisma/engines" "3.11.1-1.1a2506facaf1a4727b7c26850735e88ec779dee9"
+
 proc-log@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/proc-log/-/proc-log-1.0.0.tgz#0d927307401f69ed79341e83a0b2c9a13395eb77"
@@ -11306,6 +11361,16 @@ pupa@^2.0.1:
   dependencies:
     escape-goat "^2.0.0"
 
+purgecss@^3.0.0:
+  version "3.1.3"
+  resolved "https://registry.yarnpkg.com/purgecss/-/purgecss-3.1.3.tgz#26987ec09d12eeadc318e22f6e5a9eb0be094f41"
+  integrity sha512-hRSLN9mguJ2lzlIQtW4qmPS2kh6oMnA9RxdIYK8sz18QYqd6ePp4GNDl18oWHA1f2v2NEQIh51CO8s/E3YGckQ==
+  dependencies:
+    commander "^6.0.0"
+    glob "^7.0.0"
+    postcss "^8.2.1"
+    postcss-selector-parser "^6.0.2"
+
 purgecss@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/purgecss/-/purgecss-4.0.3.tgz#8147b429f9c09db719e05d64908ea8b672913742"
@@ -13063,6 +13128,13 @@ supports-color@^5.3.0, supports-color@^5.5.0:
   dependencies:
     has-flag "^3.0.0"
 
+supports-color@^6.1.0:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-6.1.0.tgz#0764abc69c63d5ac842dd4867e8d025e880df8f3"
+  integrity sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==
+  dependencies:
+    has-flag "^3.0.0"
+
 supports-color@^7.0.0:
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da"
@@ -13148,9 +13220,9 @@ table@^6.0.9:
     strip-ansi "^6.0.0"
 
 tailwindcss@^2.2.15:
-  version "2.2.15"
-  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-2.2.15.tgz#8bee3ebe68b988c050508ce20633f35b040dd9fe"
-  integrity sha512-WgV41xTMbnSoTNMNnJvShQZ+8GmY86DmXTrCgnsveNZJdlybfwCItV8kAqjYmU49YiFr+ofzmT1JlAKajBZboQ==
+  version "2.2.16"
+  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-2.2.16.tgz#32f81bdf1758b639cb83b9d30bf7cbecdda49e5e"
+  integrity sha512-EireCtpQyyJ4Xz8NYzHafBoy4baCOO96flM0+HgtsFcIQ9KFy/YBK3GEtlnD+rXen0e4xm8t3WiUcKBJmN6yjg==
   dependencies:
     arg "^5.0.1"
     bytes "^3.0.0"