fix: rollback live channel links pending route refactor

src/components/Epg/Epg.tsx

@@ -25,10 +25,9 @@ type Props = {
   channel: EpgChannel | undefined;
   program: EpgProgram | undefined;
   config: Config;
-  getUrl: (channelId: string) => string;
 };
 
-export default function Epg({ channels, onChannelClick, onProgramClick, channel, program, config, getUrl }: Props) {
+export default function Epg({ channels, onChannelClick, onProgramClick, channel, program, config }: Props) {
   const breakpoint = useBreakpoint();
   const { t } = useTranslation('common');
 
@@ -75,7 +74,6 @@ export default function Epg({ channels, onChannelClick, onProgramClick, channel,
                 onScrollToNow();
               }}
               isActive={channel?.id === epgChannel.uuid}
-              url={getUrl(epgChannel.uuid)}
             />
           )}
           renderProgram={({ program: programItem, isBaseTimeFormat }) => {
@@ -91,7 +89,6 @@ export default function Epg({ channels, onChannelClick, onProgramClick, channel,
                 isActive={program?.id === programItem.data.id}
                 compact={isMobile}
                 isBaseTimeFormat={isBaseTimeFormat}
-                url={getUrl(programItem.data.channelUuid)}
               />
             );
           }}

src/components/EpgChannel/EpgChannelItem.module.scss

@@ -5,8 +5,6 @@
 .epgChannelBox {
   position: absolute;
   padding: 8px 0;
-  color: inherit;
-  text-decoration: none;
   background-color: var(--body-background-color);
 }
 

src/components/EpgChannel/EpgChannelItem.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import type { Channel } from 'planby';
 import classNames from 'classnames';
-import { Link } from 'react-router-dom';
 
 import styles from './EpgChannelItem.module.scss';
 
@@ -14,15 +13,14 @@ type Props = {
   sidebarWidth: number;
   onClick?: (channel: Channel) => void;
   isActive: boolean;
-  url: string;
 };
 
-const EpgChannelItem: React.VFC<Props> = ({ channel, channelItemWidth, sidebarWidth, onClick, isActive, url }) => {
+const EpgChannelItem: React.VFC<Props> = ({ channel, channelItemWidth, sidebarWidth, onClick, isActive }) => {
   const { position, uuid, channelLogoImage } = channel;
   const style = { top: position.top, height: position.height, width: sidebarWidth };
 
   return (
-    <Link to={url} className={styles.epgChannelBox} style={style}>
+    <div className={styles.epgChannelBox} style={style}>
       <div
         className={classNames(styles.epgChannel, { [styles.active]: isActive })}
         style={{ width: channelItemWidth }}
@@ -31,7 +29,7 @@ const EpgChannelItem: React.VFC<Props> = ({ channel, channelItemWidth, sidebarWi
       >
         <Image className={styles.epgChannelLogo} image={channelLogoImage} alt="Logo" width={320} />
       </div>
-    </Link>
+    </div>
   );
 };
 

src/components/EpgProgramItem/EpgProgramItem.module.scss

@@ -6,8 +6,6 @@
   position: absolute;
   padding: 8px 4px;
   overflow: hidden;
-  color: inherit;
-  text-decoration: none;
 }
 
 .epgProgram {

src/components/EpgProgramItem/EpgProgramItem.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import { Program, useProgram } from 'planby';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
 
 import styles from './EpgProgramItem.module.scss';
 
@@ -15,10 +14,9 @@ type Props = {
   compact: boolean;
   disabled: boolean;
   isBaseTimeFormat: boolean;
-  url: string;
 };
 
-const ProgramItem: React.VFC<Props> = ({ program, onClick, isActive, compact, disabled, isBaseTimeFormat, url }) => {
+const ProgramItem: React.VFC<Props> = ({ program, onClick, isActive, compact, disabled, isBaseTimeFormat }) => {
   const {
     styles: { position },
     formatTime,
@@ -41,7 +39,7 @@ const ProgramItem: React.VFC<Props> = ({ program, onClick, isActive, compact, di
   const showLiveTagInImage = !compact && isMinWidth && isLive;
 
   return (
-    <Link to={url} className={styles.epgProgramBox} style={position} onClick={() => onClick && onClick(program)}>
+    <div className={styles.epgProgramBox} style={position} onClick={() => onClick && onClick(program)}>
       <div
         className={classNames(styles.epgProgram, {
           [styles.selected]: isActive,
@@ -61,7 +59,7 @@ const ProgramItem: React.VFC<Props> = ({ program, onClick, isActive, compact, di
           </span>
         </div>
       </div>
-    </Link>
+    </div>
   );
 };
 

src/pages/ScreenRouting/playlistScreens/PlaylistLiveChannels/PlaylistLiveChannels.tsx

@@ -124,7 +124,7 @@ const PlaylistLiveChannels: ScreenComponent<Playlist> = ({ data: { feedid, playl
   }
 
   // SEO (for channels)
-  const getUrl = (id: string) => liveChannelsURL(feedid, id);
+  // const getUrl = (id: string) => liveChannelsURL(feedid, id);
   const canonicalUrl = `${window.location.origin}${liveChannelsURL(feedid, channel.id)}`;
   const pageTitle = `${channel.title} - ${siteName}`;
 
@@ -215,7 +215,6 @@ const PlaylistLiveChannels: ScreenComponent<Playlist> = ({ data: { feedid, playl
             channel={channel}
             program={program}
             config={config}
-            getUrl={getUrl}
           />
         </div>
       </VideoDetails>