diff --git a/src/MemoryContext.tsx b/src/MemoryContext.tsx
index 89844c9..f5e5fd4 100644
--- a/src/MemoryContext.tsx
+++ b/src/MemoryContext.tsx
@@ -24,13 +24,15 @@ export interface IMemory {
[x: string]: any // TODO: **REMOVE THIS LINE WHEN PROJECT IS DONE!**
}
+type PanelFunction = () => JSX.Element;
+
export const MemoryContext = createContext<{
masterAnalyser: AnalyserNode,
audioContext: AudioContext,
- panels: JSX.Element[],
- addPanel(NewPanel: JSX.Element): void,
- removePanel(OldPanel: JSX.Element): void,
+ panels: (PanelFunction)[],
+ addPanel(NewPanel: PanelFunction): void,
+ removePanel(OldPanel: PanelFunction): void,
mousePosition: MousePosition
}>();
@@ -47,7 +49,7 @@ export function MemoryProvider(props: { children: JSX.Element }) {
const masterAnalyser = audioContext.createAnalyser();
const [panelsStore, setPanelsStore] = createStore(
- [] as JSX.Element[]
+ [] as PanelFunction[]
);
const memory = {
@@ -55,11 +57,11 @@ export function MemoryProvider(props: { children: JSX.Element }) {
masterAnalyser,
panels: panelsStore,
- addPanel(NewPanel: JSX.Element) {
+ addPanel(NewPanel: PanelFunction) {
console.log("Adding a panel...");
return setPanelsStore([...panelsStore, NewPanel]);
},
- removePanel(OldPanel: JSX.Element) {
+ removePanel(OldPanel: PanelFunction) {
console.log("Removing a panel...");
return setPanelsStore(panelsStore.filter((panel) => panel !== OldPanel));
},
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 815500b..7e71543 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -17,7 +17,7 @@ export default function Header() {
diff --git a/src/components/PanelHandler.tsx b/src/components/PanelHandler.tsx
index 4662121..e7ce062 100644
--- a/src/components/PanelHandler.tsx
+++ b/src/components/PanelHandler.tsx
@@ -18,7 +18,7 @@ export default function PanelHandler() {
"display": "flex"
}}>
- {(P) => P}
+ {(P) => P()}
)