How to use the reselect/src/index.js.createSelector function in reselect

export const getScene = (state, properties) => {
  return getScenes(state)
    .filter(scene => scene.id === properties.sceneId)[0]
}

// @TODO: This will be a problem because name is not unique
export const getSceneByName = (state, properties) => {
  return getScenes(state)
    .filter(scene => scene.name === properties.name)[0]
}

/*
 * Sort scenes by scene.name
 */
export const getScenesSorted = createSelector(
  getScenes,
  scenes => scenes.sort((a, b) => collator.compare(a.name, b.name))
)

/*
 * Get scenes that contain a certain animationId
 */
export const getScenesWithAnimation = (state, properties) => {
  return getScenes(state)
    .filter(scene => scene.animations.includes(properties.animationId))
}

/*
 * Get scenes that contain a certain fixtureId
 */
export const getScenesWithFixture = (state, properties) => {

import { createSelector } from 'reselect/src/index.js'
import { collator } from '../utils/index.js'
import { getScenes } from './index.js'

export const getTimeline = state => state.timeline
export const getTimelinePlaying = state => state.timeline.playing
export const getTimelineScenes = state => state.timeline.scenes

/*
 * Get scenes that are part of the timeline
 */
export const getTimelineScenesEnhanced = createSelector(
  getScenes,
  getTimelineScenes,
  (scenes, timelineScenes) => {

    // Create a deep copy of the original array so that we don't modify the state :/
    // @TODO: Possible performance problem?
    return JSON.parse(JSON.stringify(timelineScenes)).map(timelineScene => {
      // Find the scene
      const scene = scenes.find(_scene => _scene.id === timelineScene.sceneId)

      if (scene !== undefined) {
        timelineScene.scene = scene
      }

      return timelineScene
    })

export const getUsbDmxControllerConnected = state => state.connectionManager.usb.connected

export const getAnimation = (state, properties) => {
  return getAnimations(state)
    .filter(animation => animation.id === properties.animationId)[0]
}

export const getAnimationByName = (state, properties) => {
  return getAnimations(state)
    .filter(animation => animation.name === properties.name)[0]
}

/*
 * Sort animations by animation.name
 */
export const getAnimationsSorted = createSelector(
  getAnimations,
  animations => animations.sort((a, b) => collator.compare(a.name, b.name))
)

export const getScene = (state, properties) => {
  return getScenes(state)
    .filter(scene => scene.id === properties.sceneId)[0]
}

// @TODO: This will be a problem because name is not unique
export const getSceneByName = (state, properties) => {
  return getScenes(state)
    .filter(scene => scene.name === properties.name)[0]
}

/*

return getFixtures(state)
    .filter(fixture => fixture.id === properties.fixtureId)[0]
}

/*
 * Get a specific fixture by using the name of the fixture
 */
export const getFixtureByName = (state, properties) => {
  return getFixtures(state)
    .filter(fixture => fixture.name === properties.name)[0]
}

/*
 * Sort fixtures by fixture.name
 */
export const getFixturesSorted = createSelector(
  getFixtures,
  fixtures => fixtures.sort((a, b) => collator.compare(a.name, b.name))
)

import { createSelector } from 'reselect/src/index.js'

export const getVenues = state => state.venueManager

/*
 * Get a specific fixture by using the fixtureId
 */
export const getVenue = (state, properties) => {
  return getVenues(state)
    .filter(venue => venue.id === properties.venueId)[0]
}

/*
 * Sort venues by venue.name
 */
export const getVenuesSorted = createSelector(
  getVenues,
  venues => venues.sort((a, b) => collator.compare(a.name, b.name))
)

/*
 * Get venues that contain a specific fixture
 */
export const getVenuesWithFixture = (state, properties) => {
  return getVenues(state)
    .filter(venue => {
      return venue.slots.filter(slot => slot.fixtures.includes(properties.fixtureId))
    })
}

/*
 * Get venues that contain a specific animation