gm-dash/ui/src/App.tsx

@@ -1,10 +1,10 @@
 import './App.css';
 import Card from './components/Card/Card';
-import Activator from './components/Activator/Activator';
-import Selector from './components/Selector/Selector';
+import Launcher from './components/Launcher/Launcher';
+import LauncherGroup from './components/LauncherGroup/LauncherGroup';
 
 const LightThemes = () => <Card name="Light Themes">
-    <Selector
+    <LauncherGroup
         exclusive={true}
         options={[
             { title: "Dark reds" },
@@ -24,7 +24,7 @@ interface LightProps {
 const Light = ({ name }: LightProps) => <div> <p> {name} </p> </div>
 
 const Tracks = () => <Card name="Tracks">
-    <Selector
+    <LauncherGroup
         exclusive={false}
         options={[
             { title: "City BGM" },
@@ -38,10 +38,10 @@ const Tracks = () => <Card name="Tracks">
 interface TrackProps {
     name: string,
 }
-const Track = ({ name }: TrackProps) => <Activator title={name} />
+const Track = ({ name }: TrackProps) => <Launcher title={name} />
 
 const Presets = () => <Card name="Presets">
-    <Selector
+    <LauncherGroup
         exclusive={true}
         options={[
             { title: "Gilcrest Falls day" },
@@ -56,7 +56,7 @@ interface PresetProps {
     name: string
 }
 
-// const Scene = ({ name }: PresetProps) => <Activator title={name} activated={false} />
+// const Scene = ({ name }: PresetProps) => <Launcher title={name} activated={false} />
 
 const SceneEditor = () => <div> </div>
 

gm-dash/ui/src/components/Launcher/Launcher.tsx

@@ -1,14 +1,14 @@
-import './Activator.css';
+import './Launcher.css';
 import React from 'react';
 
-export interface ActivatorProps {
+export interface LauncherProps {
     title: string,
     icon?: string,
     activated?: boolean,
     onSelected?: (key: string) => void,
 }
 
-const Activator = ({ title, activated = false, onSelected = (key) => {} }: ActivatorProps) => {
+const Launcher = ({ title, activated = false, onSelected = (key) => {} }: LauncherProps) => {
     const classnames = activated ? "activator activator_enabled" : "activator";
     console.log("classnames ", activated, classnames);
     return (
@@ -17,4 +17,4 @@ const Activator = ({ title, activated = false, onSelected = (key) => {} }: Activ
         </div>)
 }
 
-export default Activator;
+export default Launcher;

gm-dash/ui/src/components/LauncherGroup/LauncherGroup.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
-import Activator, { ActivatorProps } from '../Activator/Activator';
+import Launcher, { LauncherProps } from '../Launcher/Launcher';
 
 export interface Selectable {
     onSelected?: (key: string) => void;
 }
 
-interface SelectorProps {
-    options: Array<ActivatorProps>;
+interface LauncherGroupProps {
+    options: Array<LauncherProps>;
     exclusive: boolean;
 }
 
@@ -23,14 +23,14 @@ const multiSelect = (state: { [key: string]: boolean }, targetId: string) => {
     }
 }
 
-const Selector = ({ options, exclusive }: SelectorProps) => {
+const LauncherGroup = ({ options, exclusive }: LauncherGroupProps) => {
     const [selected, dispatch] = React.useReducer(exclusive ? exclusiveSelect : multiSelect, {});
 
     let tiedOptions = options.map(option =>
-        <Activator key={option.title} title={option.title} onSelected={(key: string) => dispatch(key)} activated={selected[option.title]} />
+        <Launcher key={option.title} title={option.title} onSelected={(key: string) => dispatch(key)} activated={selected[option.title]} />
     );
 
     return (<div> {tiedOptions} </div>)
 }
 
-export default Selector;
+export default LauncherGroup;