Base layout

src/components/Message/Message.tsx

@@ -0,0 +1,23 @@
+import type { Component } from "solid-js";
+import { IMessageProps } from "./types";
+
+const Message: Component<IMessageProps> = (props: IMessageProps) => {
+    return (
+        <li class="list-row hover:bg-stone-700">
+            <div
+                class="avatar cursor-pointer"
+                onClick={() => props.onProfileClick(props.userId)}
+            >
+                <div class="w-10 rounded-full">
+                    <img src={props.profileImage} />
+                </div>
+            </div>
+            <div>
+                <div>{props.username}</div>
+                <p class="list-col-wrap text-xs">{props.message}</p>
+            </div>
+        </li>
+    );
+};
+
+export default Message;