From 7cd501fef69d703aa7123e57c0a6dcba4ede721e Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Fri, 4 Oct 2024 06:16:51 -0500
Subject: [PATCH] getting frontend structure staged

---
 App.tsx                           | 27 ++++-----------------------
 components/Artist/component.tsx   |  0
 components/Home/component.tsx     |  0
 components/Item/component.tsx     |  0
 components/Login/component.tsx    |  8 ++++++++
 components/Search/component.tsx   |  0
 components/Settings/component.tsx |  0
 7 files changed, 12 insertions(+), 23 deletions(-)
 create mode 100644 components/Artist/component.tsx
 create mode 100644 components/Home/component.tsx
 create mode 100644 components/Item/component.tsx
 create mode 100644 components/Login/component.tsx
 create mode 100644 components/Search/component.tsx
 create mode 100644 components/Settings/component.tsx

diff --git a/App.tsx b/App.tsx
index 0eb311a5..6c40759e 100644
--- a/App.tsx
+++ b/App.tsx
@@ -5,7 +5,7 @@
  * @format
  */
 
-import React from 'react';
+import React, { useState } from 'react';
 import type {PropsWithChildren} from 'react';
 import {
   SafeAreaView,
@@ -24,14 +24,14 @@ import {
   LearnMoreLinks,
   ReloadInstructions,
 } from 'react-native/Libraries/NewAppScreen';
-import { JellyfinService } from './api/services/jellyfin-service';
 
 type SectionProps = PropsWithChildren<{
   title: string;
 }>;
 
 function Section({children, title}: SectionProps): React.JSX.Element {
-  const isDarkMode = useColorScheme() === 'dark';
+  const [isDarkMode, setIsDarkMode ] = useState(useColorScheme() === 'dark');
+  
   return (
     <View style={styles.sectionContainer}>
       <Text
@@ -72,26 +72,7 @@ function App(): React.JSX.Element {
       <ScrollView
         contentInsetAdjustmentBehavior="automatic"
         style={backgroundStyle}>
-        <Header />
-        <View
-          style={{
-            backgroundColor: isDarkMode ? Colors.black : Colors.white,
-          }}>
-          <Section title="Step One">
-            Edit <Text style={styles.highlight}>App.tsx</Text> to change this
-            screen and then come back to see your edits.
-          </Section>
-          <Section title="See Your Changes">
-            <ReloadInstructions />
-          </Section>
-          <Section title="Debug">
-            <DebugInstructions />
-          </Section>
-          <Section title="Learn More">
-            Read the docs to discover what to do next:
-          </Section>
-          <LearnMoreLinks />
-        </View>
+
       </ScrollView>
     </SafeAreaView>
   );
diff --git a/components/Artist/component.tsx b/components/Artist/component.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/components/Home/component.tsx b/components/Home/component.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/components/Item/component.tsx b/components/Item/component.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/components/Login/component.tsx b/components/Login/component.tsx
new file mode 100644
index 00000000..f248153c
--- /dev/null
+++ b/components/Login/component.tsx
@@ -0,0 +1,8 @@
+import { Text } from "react-native";
+
+function Login(): React.JSX.Element {
+
+    return (
+        <Text></Text>
+    );
+}
\ No newline at end of file
diff --git a/components/Search/component.tsx b/components/Search/component.tsx
new file mode 100644
index 00000000..e69de29b
diff --git a/components/Settings/component.tsx b/components/Settings/component.tsx
new file mode 100644
index 00000000..e69de29b