Merge branch 'develop'

.github/ISSUE_TEMPLATE/bug_report.md

@@ -9,6 +9,9 @@ assignees: ''
 **Describe the bug**
 A clear and concise description of what the bug is.
 
+**Are you on latest or develop branch?**
+Please fill in which docker image you are currently using.
+
 **To Reproduce**
 Steps to reproduce the behavior:
 

src/components/Common/Modal/index.tsx

@@ -63,9 +63,7 @@ const Modal: React.FC<ModalProps> = ({
   });
   useLockBodyScroll(true, disableScrollLock);
 
-  return (
+  return ReactDOM.createPortal(
-    <>
-      {ReactDOM.createPortal(
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
     <div
       className="fixed top-0 left-0 right-0 bottom-0 bg-gray-800 bg-opacity-50 w-full h-full z-50 flex justify-center items-center"
@@ -181,8 +179,6 @@ const Modal: React.FC<ModalProps> = ({
       </Transition>
     </div>,
     document.body
-      )}
-    </>
   );
 };
 

src/components/Search/index.tsx

@@ -10,7 +10,6 @@ import ListView from '../Common/ListView';
 import { LanguageContext } from '../../context/LanguageContext';
 import { defineMessages, useIntl } from 'react-intl';
 import Header from '../Common/Header';
-import globalMessages from '../../i18n/globalMessages';
 
 const messages = defineMessages({
   searchresults: 'Search Results',
@@ -66,25 +65,7 @@ const Search: React.FC = () => {
 
   return (
     <>
-      <div className="md:flex md:items-center md:justify-between mb-6 sm:mb-0 mt-6">
       <Header>{intl.formatMessage(messages.searchresults)}</Header>
-        <div className="mt-4 flex md:mt-0 md:ml-4">
-          <span className="relative z-0 inline-flex shadow-sm rounded-md">
-            <button
-              type="button"
-              className="relative inline-flex items-center px-4 py-2 rounded-l-md border border-indigo-900 bg-indigo-500 hover:bg-indigo-400 text-sm leading-5 font-medium text-gray-100 hover:text-white focus:z-10 focus:outline-none focus:border-blue-300 focus:ring-blue active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"
-            >
-              {intl.formatMessage(globalMessages.movies)}
-            </button>
-            <button
-              type="button"
-              className="-ml-px relative inline-flex items-center px-4 py-2 rounded-r-md border border-indigo-900 bg-indigo-500   text-sm leading-5 font-medium text-gray-100 hover:text-white focus:z-10 focus:outline-none focus:border-blue-300 focus:ring-blue active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"
-            >
-              {intl.formatMessage(globalMessages.tvshows)}
-            </button>
-          </span>
-        </div>
-      </div>
       <ListView
         items={titles}
         isEmpty={isEmpty}

src/components/Settings/RadarrModal/index.tsx

@@ -108,7 +108,7 @@ const RadarrModal: React.FC<RadarrModalProps> = ({
           {
             hostname,
             apiKey,
-            port,
+            port: Number(port),
             baseUrl,
             useSsl,
           }
@@ -185,11 +185,11 @@ const RadarrModal: React.FC<RadarrModalProps> = ({
             const submission = {
               name: values.name,
               hostname: values.hostname,
-              port: values.port,
+              port: Number(values.port),
               apiKey: values.apiKey,
               useSsl: values.ssl,
               baseUrl: values.baseUrl,
-              activeProfileId: values.activeProfileId,
+              activeProfileId: Number(values.activeProfileId),
               activeProfileName: profileName,
               activeDirectory: values.rootFolder,
               is4k: values.is4k,

src/components/Settings/SonarrModal/index.tsx

@@ -111,7 +111,7 @@ const SonarrModal: React.FC<SonarrModalProps> = ({
           {
             hostname,
             apiKey,
-            port,
+            port: Number(port),
             baseUrl,
             useSsl,
           }
@@ -188,11 +188,11 @@ const SonarrModal: React.FC<SonarrModalProps> = ({
             const submission = {
               name: values.name,
               hostname: values.hostname,
-              port: values.port,
+              port: Number(values.port),
               apiKey: values.apiKey,
               useSsl: values.ssl,
               baseUrl: values.baseUrl,
-              activeProfileId: values.activeProfileId,
+              activeProfileId: Number(values.activeProfileId),
               activeProfileName: profileName,
               activeDirectory: values.rootFolder,
               is4k: values.is4k,

src/hooks/useClickOutside.ts

@@ -15,7 +15,7 @@ const useClickOutside = (
 ): void => {
   useEffect(() => {
     const handleBodyClick = (e: MouseEvent) => {
-      if (!ref.current?.contains(e.target as Node)) {
+      if (ref.current && !ref.current.contains(e.target as Node)) {
         callback(e);
       }
     };