From 9aa1b9fe501384f00c74dc80361f432d6a8aead0 Mon Sep 17 00:00:00 2001
From: freearhey <7253922+freearhey@users.noreply.github.com>
Date: Fri, 7 Mar 2025 04:27:23 +0300
Subject: [PATCH] Create Channel model

---
 src/components/BlockedBadge.svelte            |  2 +-
 src/components/ChannelItem.svelte             | 17 ++--
 src/components/ChannelPopup.svelte            |  2 +-
 src/components/EditButton.svelte              |  2 +-
 src/components/HTMLPreview.svelte             | 10 +--
 src/components/SearchSyntaxPopup.svelte       |  8 +-
 src/models/channel.js                         | 44 +++++++++++
 src/models/index.js                           |  1 +
 src/pages/+page.svelte                        |  2 +-
 .../channels/[country]/[name]/+page.svelte    | 13 ++--
 src/store.js                                  | 78 ++++++++++++-------
 11 files changed, 123 insertions(+), 56 deletions(-)
 create mode 100644 src/models/channel.js
 create mode 100644 src/models/index.js

diff --git a/src/components/BlockedBadge.svelte b/src/components/BlockedBadge.svelte
index aa858964f..9348a4934 100644
--- a/src/components/BlockedBadge.svelte
+++ b/src/components/BlockedBadge.svelte
@@ -9,7 +9,7 @@
     nsfw: 'The channel has been added to our blocklist due to NSFW content'
   }
 
-  const blocklistRefs = channel.blocklist_records
+  const blocklistRefs = channel._blocklistRecords
     .map(record => {
       let refName
 
diff --git a/src/components/ChannelItem.svelte b/src/components/ChannelItem.svelte
index dd7efe823..7a282e40e 100644
--- a/src/components/ChannelItem.svelte
+++ b/src/components/ChannelItem.svelte
@@ -13,6 +13,7 @@
 
   const guides = channel._guides
   const streams = channel._streams
+  const displayName = channel._displayName
 
   const [name, country] = channel.id.split('.')
 
@@ -20,11 +21,7 @@
   let prevUrl = '/'
   const onOpened = () => {
     prevUrl = window.location.href
-    window.history.pushState(
-      {},
-      `${channel.displayName} • iptv-org`,
-      `/channels/${country}/${name}`
-    )
+    window.history.pushState({}, `${displayName} • iptv-org`, `/channels/${country}/${name}`)
   }
   const onClose = () => {
     window.history.pushState({}, `iptv-org`, prevUrl)
@@ -32,13 +29,13 @@
   const showGuides = () =>
     open(
       GuidesPopup,
-      { guides, title: channel.displayName },
+      { guides, title: displayName },
       { transitionBgProps: { duration: 0 }, transitionWindowProps: { duration: 0 } }
     )
   const showStreams = () =>
     open(
       StreamsPopup,
-      { streams, title: channel.displayName },
+      { streams, title: displayName },
       { transitionBgProps: { duration: 0 }, transitionWindowProps: { duration: 0 } }
     )
   const showChannelData = () => {
@@ -89,7 +86,7 @@
           loading="lazy"
           referrerpolicy="no-referrer"
           src={channel.logo}
-          alt={channel.displayName}
+          alt={displayName}
         />
       {/if}
     </div>
@@ -103,9 +100,9 @@
             href="/channels/{country}/{name}"
             tabindex="0"
             class="font-normal text-gray-600 dark:text-white hover:underline hover:text-blue-500 truncate whitespace-nowrap"
-            title={channel.displayName}
+            title={displayName}
           >
-            {channel.displayName}
+            {displayName}
           </a>
           <div class="flex space-x-2">
             {#if channel.is_closed}
diff --git a/src/components/ChannelPopup.svelte b/src/components/ChannelPopup.svelte
index f6263590c..12d105a28 100644
--- a/src/components/ChannelPopup.svelte
+++ b/src/components/ChannelPopup.svelte
@@ -30,7 +30,7 @@
     >
       <div class="w-2/3 overflow-hidden">
         <div class="flex items-center space-x-3">
-          <h3 class="text-l font-medium text-gray-900 dark:text-white">{channel.displayName}</h3>
+          <h3 class="text-l font-medium text-gray-900 dark:text-white">{channel._displayName}</h3>
           <div class="flex space-x-2">
             {#if channel.is_closed}
               <ClosedBadge {channel} />
diff --git a/src/components/EditButton.svelte b/src/components/EditButton.svelte
index 8acbf1dfa..aa31690a1 100644
--- a/src/components/EditButton.svelte
+++ b/src/components/EditButton.svelte
@@ -6,7 +6,7 @@
   export let channel
 
   const endpoint = 'https://github.com/iptv-org/database/issues/new'
-  const title = `Edit: ${channel.displayName}`
+  const title = `Edit: ${channel._displayName}`
   const labels = 'channels:edit'
   const template = '__channels_edit.yml'
 
diff --git a/src/components/HTMLPreview.svelte b/src/components/HTMLPreview.svelte
index 9cbaf9171..3a1322707 100644
--- a/src/components/HTMLPreview.svelte
+++ b/src/components/HTMLPreview.svelte
@@ -1,7 +1,5 @@
 <script>
   import dayjs from 'dayjs'
-  import { goto } from '$app/navigation'
-  import { query, hasQuery, setSearchParam } from '~/store'
 
   export let data
   export let close = () => {}
@@ -19,7 +17,7 @@
     {
       name: 'owners',
       type: 'link[]',
-      value: data.owners.map(value => ({ label: value, query: `owners:${norm(value)}` }))
+      value: data.owners.map(value => ({ label: value, query: `owner:${norm(value)}` }))
     },
     {
       name: 'country',
@@ -41,7 +39,7 @@
     {
       name: 'broadcast_area',
       type: 'link[]',
-      value: data._broadcast_area.map(v => ({
+      value: data._broadcastArea.map(v => ({
         label: v.name,
         query: `broadcast_area:${v.type}/${v.code}`
       }))
@@ -49,12 +47,12 @@
     {
       name: 'languages',
       type: 'link[]',
-      value: data._languages.map(v => ({ label: v.name, query: `languages:${v.code}` }))
+      value: data._languages.map(v => ({ label: v.name, query: `language:${v.code}` }))
     },
     {
       name: 'categories',
       type: 'link[]',
-      value: data._categories.map(v => ({ label: v.name, query: `categories:${v.id}` }))
+      value: data._categories.map(v => ({ label: v.name, query: `category:${v.id}` }))
     },
     {
       name: 'is_nsfw',
diff --git a/src/components/SearchSyntaxPopup.svelte b/src/components/SearchSyntaxPopup.svelte
index 569ab3600..929273fc3 100644
--- a/src/components/SearchSyntaxPopup.svelte
+++ b/src/components/SearchSyntaxPopup.svelte
@@ -15,12 +15,12 @@
       result: 'Find channels that have "Nat Geo" in the name.'
     },
     {
-      query: 'alt_names:חינוכית',
+      query: 'alt_name:חינוכית',
       result: 'Finds channels whose alternative name contains "חינוכית".'
     },
     { query: 'network:ABC', result: 'Finds all channels operated by the ABC Network.' },
     {
-      query: 'owners:^$',
+      query: 'owner:^$',
       result: 'Finds channels that have no owner listed.'
     },
     { query: 'country:GY', result: 'Finds all channels that are broadcast from Guyana.' },
@@ -30,8 +30,8 @@
     },
     { query: 'city:"San Francisco"', result: 'Finds all channels broadcast from San Francisco.' },
     { query: 'broadcast_area:c/CV', result: 'Finds channels that are broadcast in Cape Verde.' },
-    { query: 'languages:fra', result: 'Find channels that are broadcast in French.' },
-    { query: 'categories:news', result: 'Finds all the news channels.' },
+    { query: 'language:fra', result: 'Find channels that are broadcast in French.' },
+    { query: 'category:news', result: 'Finds all the news channels.' },
     { query: 'website:.', result: 'Finds channels that have a link to the official website.' },
     { query: 'is_nsfw:true', result: 'Finds channels marked as NSFW.' },
     {
diff --git a/src/models/channel.js b/src/models/channel.js
new file mode 100644
index 000000000..80bf3fafe
--- /dev/null
+++ b/src/models/channel.js
@@ -0,0 +1,44 @@
+export class Channel {
+  constructor(data) {
+    this.id = data.id
+    this.name = data.name
+    this.alt_names = this.alt_name = data.altNames
+    this.network = data.network
+    this.owners = this.owner = data.owners
+    this.city = data.city
+    this.country = [data.country?.code, data.country?.name].filter(Boolean)
+    this.subdivision = data.subdivision?.code || null
+    this.languages = this.language = [
+      ...data.languages.map(language => language.code),
+      ...data.languages.map(language => language.name)
+    ]
+    this.categories = this.category = data.categories.map(category => category.name)
+    this.broadcast_area = [
+      ...data.broadcastArea.map(area => `${area.type}/${area.code}`).filter(Boolean),
+      ...data.broadcastArea.map(area => area.name).filter(Boolean),
+      ...data.regionCountries.map(country => country.code).filter(Boolean),
+      ...data.regionCountries.map(country => country.name).filter(Boolean)
+    ]
+    this.is_nsfw = data.isNSFW
+    this.launched = data.launched
+    this.closed = data.closed
+    this.is_closed = !!data.closed || !!data.replacedBy
+    this.replaced_by = data.replacedBy
+    this.website = data.website
+    this.logo = data.logo
+    this.streams = Array.isArray(data.streams) ? data.streams.length : 0
+    this.guides = Array.isArray(data.guides) ? data.guides.length : 0
+    this.is_blocked = Array.isArray(data.blocklistRecords) && data.blocklistRecords.length > 0
+
+    this._hasUniqueName = data._hasUniqueName
+    this._displayName = data._hasUniqueName ? data.name : `${data.name} (${data.country?.name})`
+    this._country = data.country
+    this._subdivision = data.subdivision || null
+    this._languages = data.languages
+    this._categories = data.categories
+    this._broadcastArea = data.broadcastArea
+    this._streams = data.streams || []
+    this._guides = data.guides || []
+    this._blocklistRecords = data.blocklistRecords || []
+  }
+}
diff --git a/src/models/index.js b/src/models/index.js
new file mode 100644
index 000000000..54e0d98a5
--- /dev/null
+++ b/src/models/index.js
@@ -0,0 +1 @@
+export * from './channel'
diff --git a/src/pages/+page.svelte b/src/pages/+page.svelte
index 45cbe865a..1a0fb3131 100644
--- a/src/pages/+page.svelte
+++ b/src/pages/+page.svelte
@@ -23,7 +23,7 @@
   let _countries = []
   let isLoading = true
 
-  $: groupedByCountry = _.groupBy($filteredChannels, 'country')
+  $: groupedByCountry = _.groupBy($filteredChannels, channel => channel._country.code)
 
   onMount(async () => {
     if (!$channels.length) {
diff --git a/src/pages/channels/[country]/[name]/+page.svelte b/src/pages/channels/[country]/[name]/+page.svelte
index b1563156c..d88394977 100644
--- a/src/pages/channels/[country]/[name]/+page.svelte
+++ b/src/pages/channels/[country]/[name]/+page.svelte
@@ -8,9 +8,10 @@
   export let data
 
   let isLoading = false
-  let channel = data.channel
-  let streams = channel ? channel._streams : []
-  let guides = channel ? channel._guides : []
+  const channel = data.channel
+  const streams = channel ? channel._streams : []
+  const guides = channel ? channel._guides : []
+  const displayName = channel._displayName
 
   const structuredData = {
     '@context': 'https://schema.org/',
@@ -28,8 +29,8 @@
 </script>
 
 <svelte:head>
-  <title>{channel && channel.displayName ? `${channel.displayName} • iptv-org` : 'iptv-org'}</title>
-  <meta name="description" content="Detailed description of {channel.displayName}." />
+  <title>{channel && displayName ? `${displayName} • iptv-org` : 'iptv-org'}</title>
+  <meta name="description" content="Detailed description of {displayName}." />
   {@html schema()}
 </svelte:head>
 
@@ -54,7 +55,7 @@
           <div class="w-2/3 overflow-hidden">
             <div class="flex space-x-3">
               <h1 class="text-l font-medium text-gray-900 dark:text-white">
-                {channel.displayName}
+                {displayName}
               </h1>
               <div class="flex items-center space-x-2">
                 {#if channel.is_closed}
diff --git a/src/store.js b/src/store.js
index 646b14c5a..ed371bea0 100644
--- a/src/store.js
+++ b/src/store.js
@@ -3,6 +3,7 @@ import { Playlist, Link } from 'iptv-playlist-generator'
 import sj from '@freearhey/search-js'
 import _ from 'lodash'
 import { browser } from '$app/environment'
+import { Channel } from './models'
 
 export const query = writable('')
 export const hasQuery = writable(false)
@@ -32,7 +33,7 @@ export async function fetchChannels() {
 
   countries.set(api.countries)
 
-  let _channels = api.channels.map(c => transformChannel(c, api))
+  let _channels = api.channels.map(c => createChannel(c, api))
 
   channels.set(_channels)
   filteredChannels.set(_channels)
@@ -41,13 +42,17 @@ export async function fetchChannels() {
       'id',
       'name',
       'alt_names',
+      'alt_name',
       'network',
+      'owner',
       'owners',
       'country',
       'subdivision',
       'city',
       'broadcast_area',
+      'language',
       'languages',
+      'category',
       'categories',
       'launched',
       'closed',
@@ -155,38 +160,59 @@ async function loadAPI() {
   return api
 }
 
-export function transformChannel(channel, data) {
-  channel._streams = data.streams[channel.id] || []
-  channel._guides = data.guides[channel.id] || []
-  channel._country = data.countries[channel.country]
-  channel._subdivision = data.subdivisions[channel.subdivision]
-  channel._languages = channel.languages.map(code => data.languages[code]).filter(i => i)
-  channel._categories = channel.categories.map(id => data.categories[id]).filter(i => i)
-  channel._broadcast_area = channel.broadcast_area.map(value => {
-    const [type, code] = value.split('/')
+function createChannel(data, api) {
+  let broadcastArea = []
+  let regionCountries = []
+
+  data.broadcast_area.forEach(areaCode => {
+    const [type, code] = areaCode.split('/')
     switch (type) {
       case 'c':
-        return { type, ...data.countries[code] }
+        const country = api.countries[code]
+        if (country) broadcastArea.push({ type, code: country.code, name: country.name })
+        break
       case 'r':
-        return { type, ...data.regions[code] }
+        const region = api.regions[code]
+        if (region) {
+          broadcastArea.push({ type, code: region.code, name: region.name })
+          regionCountries = [
+            ...regionCountries,
+            ...region.countries.map(code => api.countries[code]).filter(Boolean)
+          ]
+        }
+        break
       case 's':
-        return { type, ...data.subdivisions[code] }
+        const subdivision = api.subdivisions[code]
+        if (subdivision)
+          broadcastArea.push({ type, code: subdivision.code, name: subdivision.name })
+        break
     }
   })
-  channel.is_closed = !!channel.closed || !!channel.replaced_by
-  channel.is_blocked = !!data.blocklist[channel.id]
-  channel.streams = channel._streams.length
-  channel.guides = channel._guides.length
-  channel.blocklist_records = Array.isArray(data.blocklist[channel.id])
-    ? data.blocklist[channel.id]
-    : []
 
-  const isChannelNameRepeated = data.nameIndex[channel.name.toLowerCase()].length > 1
-  channel.displayName = isChannelNameRepeated
-    ? `${channel.name} (${channel._country.name})`
-    : channel.name
-
-  return channel
+  return new Channel({
+    id: data.id,
+    name: data.name,
+    altNames: data.alt_names,
+    network: data.network,
+    owners: data.owners,
+    city: data.city,
+    country: api.countries[data.country],
+    subdivision: api.subdivisions[data.subdivision],
+    languages: data.languages.map(code => api.languages[code]).filter(Boolean),
+    categories: data.categories.map(id => api.categories[id]).filter(Boolean),
+    isNSFW: data.is_nsfw,
+    launched: data.launched,
+    closed: data.closed,
+    replacedBy: data.replaced_by,
+    website: data.website,
+    logo: data.logo,
+    streams: api.streams[data.id],
+    guides: api.guides[data.id],
+    blocklistRecords: api.blocklist[data.id],
+    hasUniqueName: api.nameIndex[data.name.toLowerCase()].length === 1,
+    broadcastArea,
+    regionCountries
+  })
 }
 
 function getStreams() {