🎨 SelectedServiceをglobalFamilyに

番組表でサービス切り替えができるように

src/atoms/contentPlayer.ts

@@ -1,6 +1,5 @@
 import { atom } from "recoil"
 import pkg from "../../package.json"
-import { Service } from "../infra/mirakurun/api"
 import type {
   AribSubtitleData,
   ContentPlayerKeyForRestoration,
@@ -9,11 +8,6 @@ import { VLCAudioChannel } from "../utils/vlc"
 
 const prefix = `${pkg.name}.contentPlayer`
 
-export const contentPlayerSelectedServiceAtom = atom<Service | null>({
-  key: `${prefix}.selectedService`,
-  default: null,
-})
-
 export const contentPlayerTitleAtom = atom<string | null>({
   key: `${prefix}.title`,
   default: null,

src/atoms/contentPlayerResolvedFamilies.ts

@@ -1,5 +1,11 @@
 import { remoteWindow } from "../utils/remote"
-import { globalContentPlayerPlayingContentFamily } from "./globalFamilies"
+import {
+  globalContentPlayerPlayingContentFamily,
+  globalContentPlayerSelectedServiceFamily,
+} from "./globalFamilies"
 
 export const contentPlayerPlayingContentAtom =
   globalContentPlayerPlayingContentFamily(remoteWindow.id)
+
+export const contentPlayerSelectedServiceAtom =
+  globalContentPlayerSelectedServiceFamily(remoteWindow.id)

src/atoms/globalFamilies.ts

@@ -1,7 +1,11 @@
 import { atomFamily } from "recoil"
+import { Service } from "../infra/mirakurun/api"
 
 import { ContentPlayerPlayingContent } from "../types/contentPlayer"
-import { globalContentPlayerPlayingContentFamilyKey } from "./globalFamilyKeys"
+import {
+  globalContentPlayerPlayingContentFamilyKey,
+  globalContentPlayerSelectedServiceFamilyKey,
+} from "./globalFamilyKeys"
 
 export const globalContentPlayerPlayingContentFamily = atomFamily<
   ContentPlayerPlayingContent | null,
@@ -10,3 +14,11 @@ export const globalContentPlayerPlayingContentFamily = atomFamily<
   key: globalContentPlayerPlayingContentFamilyKey,
   default: null,
 })
+
+export const globalContentPlayerSelectedServiceFamily = atomFamily<
+  Service | null,
+  number
+>({
+  key: globalContentPlayerSelectedServiceFamilyKey,
+  default: null,
+})

src/atoms/globalFamilyKeys.ts

@@ -3,3 +3,5 @@ import pkg from "../../package.json"
 const prefix = `${pkg.name}.global`
 
 export const globalContentPlayerPlayingContentFamilyKey = `${prefix}.playingContent`
+
+export const globalContentPlayerSelectedServiceFamilyKey = `${prefix}.selectedService`

src/components/contentPlayer/Controller.tsx

@@ -15,11 +15,11 @@ import {
   contentPlayerPlayingTimeAtom,
   contentPlayerPositionUpdateTriggerAtom,
   contentPlayerScreenshotTriggerAtom,
-  contentPlayerSelectedServiceAtom,
   contentPlayerServiceLogoUrlAtom,
   contentPlayerSubtitleEnabledAtom,
   contentPlayerVolumeAtom,
 } from "../../atoms/contentPlayer"
+import { contentPlayerSelectedServiceAtom } from "../../atoms/contentPlayerResolvedFamilies"
 import {
   contentPlayerProgramSelector,
   contentPlayerServiceSelector,

src/components/contentPlayer/MirakurunManager.tsx

@@ -5,10 +5,12 @@ import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil"
 import {
   contentPlayerIsPlayingAtom,
   contentPlayerKeyForRestorationAtom,
-  contentPlayerSelectedServiceAtom,
   contentPlayerServiceLogoUrlAtom,
 } from "../../atoms/contentPlayer"
-import { contentPlayerPlayingContentAtom } from "../../atoms/contentPlayerResolvedFamilies"
+import {
+  contentPlayerPlayingContentAtom,
+  contentPlayerSelectedServiceAtom,
+} from "../../atoms/contentPlayerResolvedFamilies"
 import {
   contentPlayerServiceSelector,
   contentPlayerUrlSelector,

src/constants/recoil.ts

@@ -3,7 +3,10 @@ import {
   contentPlayerKeyForRestorationAtom,
   contentPlayerVolumeAtom,
 } from "../atoms/contentPlayer"
-import { globalContentPlayerPlayingContentFamilyKey } from "../atoms/globalFamilyKeys"
+import {
+  globalContentPlayerPlayingContentFamilyKey,
+  globalContentPlayerSelectedServiceFamilyKey,
+} from "../atoms/globalFamilyKeys"
 import { globalActiveContentPlayerIdAtomKey } from "../atoms/globalKeys"
 import { mirakurunServicesAtom } from "../atoms/mirakurun"
 import {
@@ -24,6 +27,7 @@ export const RECOIL_SHARED_ATOM_KEYS = [
   mirakurunServicesAtom.key,
   globalActiveContentPlayerIdAtomKey,
   globalContentPlayerPlayingContentFamilyKey,
+  globalContentPlayerSelectedServiceFamilyKey,
 ]
 
 export const RECOIL_STORED_ATOM_KEYS = [

src/utils/contextmenu.ts

@@ -3,8 +3,8 @@ import { useRecoilState, useRecoilValue } from "recoil"
 import {
   contentPlayerIsPlayingAtom,
   contentPlayerKeyForRestorationAtom,
-  contentPlayerSelectedServiceAtom,
 } from "../atoms/contentPlayer"
+import { contentPlayerSelectedServiceAtom } from "../atoms/contentPlayerResolvedFamilies"
 import { mirakurunServicesAtom } from "../atoms/mirakurun"
 import { REUQEST_OPEN_WINDOW } from "../constants/ipc"
 import { ROUTES } from "../constants/routes"

src/windows/ProgramTable.tsx

@@ -2,7 +2,8 @@ import clsx from "clsx"
 import React, { useEffect, useState } from "react"
 import { useSetRecoilState, useRecoilValue } from "recoil"
 import pkg from "../../package.json"
-import { contentPlayerSelectedServiceAtom } from "../atoms/contentPlayer"
+import { globalContentPlayerSelectedServiceFamily } from "../atoms/globalFamilies"
+import { globalActiveContentPlayerIdSelector } from "../atoms/globalSelectors"
 import { mirakurunServicesAtom } from "../atoms/mirakurun"
 import { mirakurunSetting } from "../atoms/settings"
 import { ScrollArea } from "../components/programTable/ScrollArea"
@@ -13,7 +14,10 @@ import { remoteWindow } from "../utils/remote"
 export const CoiledProgramTable: React.VFC<{}> = () => {
   const now = useNow()
   const [add, setAdd] = useState(0)
-  const setSelectedService = useSetRecoilState(contentPlayerSelectedServiceAtom)
+  const activePlayerId = useRecoilValue(globalActiveContentPlayerIdSelector)
+  const setSelectedService = useSetRecoilState(
+    globalContentPlayerSelectedServiceFamily(activePlayerId ?? 0)
+  )
   const services = useRecoilValue(mirakurunServicesAtom)
   const mirakurunSettingValue = useRecoilValue(mirakurunSetting)