new features context to render features correctly on change

src/pages/AuthenticationPage/AuthenticationPage.tsx

@@ -13,9 +13,7 @@ interface state {
     wrongPWDInfo: boolean;
 }
 
-interface Props {
-    onSuccessLogin: () => void;
-}
+interface Props {}
 
 class AuthenticationPage extends React.Component<Props, state> {
     constructor(props: Props) {

src/pages/Player/Player.tsx

@@ -22,6 +22,7 @@ import {Button} from '../../elements/GPElements/Button';
 import {VideoTypes} from '../../types/ApiTypes';
 import GlobalInfos from '../../utils/GlobalInfos';
 import {ButtonPopup} from '../../elements/Popups/ButtonPopup/ButtonPopup';
+import {FeatureContext} from '../../utils/context/FeatureContext';
 
 interface Props extends RouteComponentProps<{id: string}> {}
 
@@ -65,6 +66,8 @@ export class Player extends React.Component<Props, mystate> {
         this.quickAddTag = this.quickAddTag.bind(this);
     }
 
+    static contextType = FeatureContext;
+
     componentDidMount(): void {
         // initial fetch of current movie data
         this.fetchMovieData();
@@ -205,7 +208,7 @@ export class Player extends React.Component<Props, mystate> {
     }
 
     renderDeletePopup(): JSX.Element {
-        if (GlobalInfos.isVideoFulldeleteable()) {
+        if (this.context.VideosFullyDeleteable) {
             return (
                 <ButtonPopup
                     onDeny={(): void => this.setState({deletepopupvisible: false})}

src/pages/SettingsPage/SettingsPage.tsx

@@ -1,9 +1,10 @@
-import React from 'react';
+import React, {useContext} from 'react';
 import MovieSettings from './MovieSettings';
 import GeneralSettings from './GeneralSettings';
 import style from './SettingsPage.module.css';
 import GlobalInfos from '../../utils/GlobalInfos';
 import {NavLink, Redirect, Route, Switch, useRouteMatch} from 'react-router-dom';
+import {FeatureContext} from '../../utils/context/FeatureContext';
 
 /**
  * The Settingspage handles all kinds of settings for the mediacenter
@@ -12,6 +13,7 @@ import {NavLink, Redirect, Route, Switch, useRouteMatch} from 'react-router-dom'
 const SettingsPage = (): JSX.Element => {
     const themestyle = GlobalInfos.getThemeStyle();
     const match = useRouteMatch();
+    const features = useContext(FeatureContext);
 
     return (
         <div>
@@ -23,7 +25,7 @@ const SettingsPage = (): JSX.Element => {
                 <NavLink to='/media/settings/movies'>
                     <div className={style.SettingSidebarElement}>Movies</div>
                 </NavLink>
-                {GlobalInfos.isTVShowEnabled() ? (
+                {features.TVShowEnabled ? (
                     <NavLink to='/media/settings/tv'>
                         <div className={style.SettingSidebarElement}>TV Shows</div>
                     </NavLink>
@@ -37,7 +39,7 @@ const SettingsPage = (): JSX.Element => {
                     <Route path={`${match.url}/movies`}>
                         <MovieSettings />
                     </Route>
-                    {GlobalInfos.isTVShowEnabled() ? (
+                    {features.TVShowEnabled ? (
                         <Route path={`${match.url}/tv`}>
                             <span />
                         </Route>

src/pages/TVShowPage/TVShowPage.tsx

@@ -72,7 +72,7 @@ export default function (): JSX.Element {
 
     return (
         <Switch>
-            <Route path={`${match.path}/:id`}>
+            <Route exact path={`${match.path}/:id`}>
                 <EpisodePage />
             </Route>
             <Route path={match.path}>