From cb413362a751e9a17ee02cce5e007c6b8f423c91 Mon Sep 17 00:00:00 2001
From: Bram Suurd <78373894+BramSuurdje@users.noreply.github.com>
Date: Mon, 29 Apr 2024 01:06:23 +0200
Subject: [PATCH] Refactor page.tsx and Script.tsx components

---
 app/scripts/page.tsx   | 4 ++--
 components/Script.tsx  | 6 +++---
 components/Sidebar.tsx | 1 +
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/app/scripts/page.tsx b/app/scripts/page.tsx
index eefd0e4..47ba364 100644
--- a/app/scripts/page.tsx
+++ b/app/scripts/page.tsx
@@ -1,7 +1,6 @@
 'use client'
 import Navbar from "@/components/Navbar";
 import React, { useEffect, useState } from "react";
-import Script from "@/components/Script";
 import {
   Accordion,
   AccordionItem,
@@ -9,6 +8,7 @@ import {
   AccordionContent,
 } from "@/components/ui/accordion";
 import { Input } from "@/components/ui/input";
+import ScriptItem from "@/components/Script";
 
 interface Script {
   title: string;
@@ -103,7 +103,7 @@ export default function Page() {
         </div>
         <div className="flex">
           <div className="h-screen w-full">
-            <Script scriptID={selectedItem} />
+            <ScriptItem scriptID={selectedItem} />
           </div>
         </div>
       </div>
diff --git a/components/Script.tsx b/components/Script.tsx
index a70f603..5cfce75 100644
--- a/components/Script.tsx
+++ b/components/Script.tsx
@@ -37,14 +37,14 @@ type RecordModel = {
   updated: string;
 };
 
-const Script: React.FC<ScriptProps> = ({ scriptID }) => {
+const ScriptItem: React.FC<ScriptProps> = ({ scriptID }) => {
   const [item, setItem] = useState<Script | null>(null);
 
   const getItem = async () => {
     const record = await pb
       .collection("proxmox_scripts")
       .getOne(`${scriptID}`, {});
-    setItem(record as Script);
+    setItem(record as unknown as Script);
   };
 
   useEffect(() => {
@@ -202,4 +202,4 @@ const Script: React.FC<ScriptProps> = ({ scriptID }) => {
   );
 };
 
-export default Script;
+export default ScriptItem;
diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx
index 6c2952f..049a5b5 100644
--- a/components/Sidebar.tsx
+++ b/components/Sidebar.tsx
@@ -1,3 +1,4 @@
+'use client'
 import React, { useState, useEffect } from "react";
 import {
   Accordion,