wip: not showing all options

Author: Julusian

packages/webui/src/client/ui/Settings/Studio/Devices/ParentDevices.tsx

@@ -20,15 +20,14 @@ import { unprotectString } from '@sofie-automation/corelib/dist/protectedString'
 import { SchemaFormWithOverrides } from '../../../../lib/forms/SchemaFormWithOverrides'
 import { LabelActual, LabelAndOverrides } from '../../../../lib/Components/LabelAndOverrides'
 import { getRandomString, literal } from '@sofie-automation/corelib/dist/lib'
-import { PeripheralDevice } from '@sofie-automation/corelib/dist/dataModel/PeripheralDevice'
 import { StudioDeviceSettings } from '@sofie-automation/corelib/dist/dataModel/Studio'
 import {
 	SomeObjectOverrideOp,
 	wrapDefaultObject,
 	ObjectOverrideSetOp,
 } from '@sofie-automation/corelib/dist/settings/objectWithOverrides'
 import Tooltip from 'rc-tooltip'
-import { Studios } from '../../../../collections'
+import { PeripheralDevices, Studios } from '../../../../collections'
 import { getHelpMode } from '../../../../lib/localStorage'
 import { useTracker } from '../../../../lib/ReactMeteorData/ReactMeteorData'
 import { TextInputControl } from '../../../../lib/Components/TextInput'
@@ -37,9 +36,8 @@ import { MeteorCall } from '../../../../lib/meteorApi'
 
 interface StudioParentDevicesProps {
 	studioId: StudioId
-	studioDevices: PeripheralDevice[]
 }
-export function StudioParentDevices({ studioId, studioDevices }: Readonly<StudioParentDevicesProps>): JSX.Element {
+export function StudioParentDevices({ studioId }: Readonly<StudioParentDevicesProps>): JSX.Element {
 	const { t } = useTranslation()
 
 	const studio = useTracker(() => Studios.findOne(studioId), [studioId])
@@ -75,11 +73,6 @@ export function StudioParentDevices({ studioId, studioDevices }: Readonly<Studio
 		[deviceSettings]
 	)
 
-	const filteredPeripheralDevices = useMemo(
-		() => studioDevices.filter((d) => d.parentDeviceId === undefined),
-		[studioDevices]
-	)
-
 	const addNewItem = useCallback(() => {
 		const newId = getRandomString()
 		const newDevice = literal<StudioDeviceSettings>({
@@ -113,12 +106,7 @@ export function StudioParentDevices({ studioId, studioDevices }: Readonly<Studio
 				</Tooltip>
 			</h2>
 
-			<GenericParentDevicesTable
-				studioId={studioId}
-				devices={wrappedDeviceSettings}
-				overrideHelper={overrideHelper}
-				peripheralDevices={filteredPeripheralDevices}
-			/>
+			<GenericParentDevicesTable studioId={studioId} devices={wrappedDeviceSettings} overrideHelper={overrideHelper} />
 
 			<div className="mod mhs">
 				<button className="btn btn-primary" onClick={addNewItem}>
@@ -140,21 +128,22 @@ interface ParentDevicesTableProps {
 	studioId: StudioId
 	devices: WrappedOverridableItem<StudioDeviceSettings>[]
 	overrideHelper: OverrideOpHelper
-	peripheralDevices: PeripheralDevice[]
 }
 function GenericParentDevicesTable({
 	studioId,
 	devices,
 	overrideHelper,
-	peripheralDevices,
 }: Readonly<ParentDevicesTableProps>): JSX.Element {
 	const { t } = useTranslation()
 	const { toggleExpanded, isExpanded } = useToggleExpandHelper()
 
+	const allParentDevices = useTracker(() => PeripheralDevices.find({ parentDeviceId: undefined }).fetch(), [], [])
+
 	const peripheralDevicesByConfigIdMap = useMemo(() => {
 		const devicesMap = new Map<string, PeripheralDeviceTranslated>()
 
-		for (const device of peripheralDevices) {
+		for (const device of allParentDevices) {
+			if (device.studioId !== studioId) continue
 			if (!device.configId) continue
 
 			devicesMap.set(
@@ -169,7 +158,7 @@ function GenericParentDevicesTable({
 		}
 
 		return devicesMap
-	}, [peripheralDevices])
+	}, [studioId, allParentDevices])
 
 	const confirmRemove = useCallback(
 		(parentdeviceId: string) => {
@@ -205,7 +194,7 @@ function GenericParentDevicesTable({
 			},
 		]
 
-		for (const device of peripheralDevices) {
+		for (const device of allParentDevices) {
 			options.push({
 				value: device._id,
 				name: device.name || unprotectString(device._id),
@@ -214,7 +203,7 @@ function GenericParentDevicesTable({
 		}
 
 		return options
-	}, [peripheralDevicesByConfigIdMap])
+	}, [allParentDevices])
 
 	const undeleteItemWithId = useCallback(
 		(itemId: string) => overrideHelper().resetItem(itemId).commit(),

packages/webui/src/client/ui/Settings/Studio/Devices/index.tsx

@@ -25,7 +25,7 @@ export function StudioDevices({ studioId }: Readonly<IStudioDevicesProps>): JSX.
 		<>
 			<StudioSelectDevices studioId={studioId} studioDevices={studioDevices} />
 
-			<StudioParentDevices studioId={studioId} studioDevices={studioDevices} />
+			<StudioParentDevices studioId={studioId} />
 
 			<StudioPlayoutSubDevices studioId={studioId} studioDevices={studioDevices} />