this still dont work

client/package.json

@@ -10,7 +10,6 @@
     "@types/node": "^17.0.45",
     "@types/react": "^18.2.21",
     "@types/react-dom": "^18.2.7",
-    "@types/react-swipeable-views": "^0.13.2",
     "emoji-mart": "^5.5.2",
     "emoji-picker-react": "^4.5.15",
     "link-preview-js": "^3.0.5",
@@ -20,7 +19,6 @@
     "react-linkify": "^1.0.0-alpha",
     "react-router-dom": "^6.15.0",
     "react-scripts": "5.0.1",
-    "react-swipeable-views": "^0.14.0",
     "web-vitals": "^2.1.4",
     "workbox-background-sync": "^6.6.0",
     "workbox-broadcast-update": "^6.6.0",

client/src/App.tsx

@@ -1,40 +1,19 @@
-import React from "react";
 import "./App.css";
 import Home from "./components/Home";
 import Settings from "./components/Settings";
-import SwipeableViews from "react-swipeable-views";
 import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
 import Thread from "./components/Thread";
 import Header from "./components/Header/Header";
 
 function App() {
-  const [index, setIndex] = React.useState(1);
-
-  const handleChangeIndex = (index: number) => {
-    console.log("Changed index to:", index); // Add a log to see if this function is called
-    setIndex(index);
-  };
 
   return (
     <Router>
       <Header />
       <Routes>
         <Route path="/settings" element={<Settings />} />
-        <Route path="/home" element={<Home />} />
+        <Route path="/" element={<Home />} />
         <Route path="/thread/:id" element={<Thread />} />
-        <Route
-          path="/"
-          element={
-            <SwipeableViews
-              index={index}
-              onChangeIndex={handleChangeIndex}
-              className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8"
-            >
-              <Settings />
-              <Home />
-            </SwipeableViews>
-          }
-        />
       </Routes>
     </Router>
   );

client/src/components/Forms/Emojis/emoji-picker.tsx

@@ -32,7 +32,9 @@ export function EmojiPicker({
     return {
       id: pack.id,
       name: pack.name,
-      emojis: pack.emojis.map((e) => {
+      emojis: pack.emojis
+      .filter((e) => !e.static_url.endsWith('.svg'))
+      .map((e) => {
         return {
           id: e.shortcode,
           name: e.shortcode,
@@ -45,23 +47,17 @@ export function EmojiPicker({
   return (
     <>
       <div className="absolute z-25" ref={ref}>
-        <style>
-          {`
-              em-emoji-picker { max-height: ${height}px; }
-              `}
-        </style>
         <Picker
           autoFocus
-          data={data}
           custom={customEmojiList}
+          data = {data}
           perLine={7}
           previewPosition="none"
-          skinTonePosition="search"
+          skinTonePosition="none"
           theme="dark"
           onEmojiSelect={onEmojiSelect}
           onClickOutside={onClickOutside}
-          maxFrequentRows={3}
-          categoryIcons={customCategoryIcons}
+          categories={['poast']}
         />
       </div>
     </>

client/src/components/Forms/PostFormCard.tsx

@@ -155,16 +155,16 @@ const NewNoteCard = ({
         setShowEmojiPicker(false);
         try {
             if (emoji.id) {
-            const e = getEmojiById(emoji.id);
-            if (e) {
-                setComment(comment + " :" + e.shortcode + ":");
-                unsigned.tags.push(['emoji', e.shortcode, e.url]);
-              };
+                const e = getEmojiById(emoji.id);
+                if (e) {
+                    setComment(comment + " :" + e.shortcode + ":");
+                    unsigned.tags.push(['emoji', e.shortcode, e.url]);
+                };
             }
-          } catch {
-          //ignore
+        } catch {
+            //ignore
         }
-      }
+    }
 
     const topOffset = ref.current?.getBoundingClientRect().top;
     const leftOffset = ref.current?.getBoundingClientRect().left;
@@ -231,7 +231,7 @@ const NewNoteCard = ({
                                         ref={emojiRef}
                                     />
                                 )}
-                                <FaceSmileIcon className="h-4 w-4 text-neutral-400 cursor-pointer" onClick={pickEmoji}/>
+                                <FaceSmileIcon className="h-4 w-4 text-neutral-400 cursor-pointer" onClick={pickEmoji} />
                             </div>
                             <div className="flex items-center">
                                 <ArrowUpTrayIcon
@@ -267,7 +267,8 @@ const NewNoteCard = ({
                             </div>
                             <button
                                 type="submit"
-                                className="h-9 inline-flex items-center justify-center px-4 bg-blue-500 hover:bg-blue-600 rounded-lg text-white font-medium text-sm"
+                                className={`h-9 inline-flex items-center justify-center px-4 rounded-lg text-white font-medium text-sm ${doingWorkProp || uploadingFile || comment === "" ? 'bg-blue-900 cursor-not-allowed' : 'bg-blue-500 hover:bg-blue-600'}`}
+                                disabled={doingWorkProp || uploadingFile || comment === ""}
                             >
                                 Submit
                             </button>

client/src/components/Forms/custom_emojis.json

@@ -4,16 +4,6 @@
         "name": "poast",
         "emojis":
 [
-    {
-        "category": "",
-        "shortcode": "0",
-        "static_url": "https://poa.st/emoji/stolen/0.png",
-        "tags": [
-            "Custom"
-        ],
-        "url": "https://poa.st/emoji/stolen/0.png",
-        "visible_in_picker": true
-    },
     {
         "category": "",
         "shortcode": "00",

client/src/components/Thread.tsx

@@ -4,7 +4,7 @@ import { Event, nip19 } from "nostr-tools"
 import { subNote, subNotesOnce } from '../utils/subscriptions';
 import { useEffect } from 'react';
 import { uniqBy } from '../utils/otherUtils';
-import { ChatBubbleOvalLeftIcon, PlusCircleIcon } from '@heroicons/react/24/outline';
+import { DocumentTextIcon, FolderPlusIcon } from '@heroicons/react/24/outline';
 import { getPow } from '../utils/mine';
 import PostCard from './Modals/Card';
 import Placeholder from './Modals/Placeholder';
@@ -119,7 +119,7 @@ const Thread = () => {
                     {OPEvent && <PostCard event={OPEvent} metadata={getMetadataEvent(OPEvent)} replyCount={countReplies(OPEvent)} type={'OP'}/>}
                 </div>
                 <div className="col-span-full flex justify-center space-x-36">
-                    <ChatBubbleOvalLeftIcon
+                    <DocumentTextIcon
                         className="h-5 w-5 text-gray-200 cursor-pointer"
                         onClick={() => {
                             setShowForm(prevShowForm => !prevShowForm);
@@ -127,7 +127,7 @@ const Thread = () => {
                         }}
                     />
 
-                    <PlusCircleIcon
+                    <FolderPlusIcon
                         className="h-5 w-5 text-gray-200 cursor-pointer"
                         onClick={() => {
                             setShowForm(prevShowForm => !prevShowForm);