added b ios

src/lib/components/Form.svelte

@@ -5,24 +5,31 @@
     export let form = {};
     export let action = '/';
     export let name = 'Empty form';
+    export let format = true;
 
-    let submitFunc = async e => form = JSON.parse(await handleSubmit(e))
+    export let submitFunc = async e => form = JSON.parse(await handleSubmit(e))
 </script>
 
-<Area handleSubmit=''>
-    <span slot="header">
-        {name}
-    </span>
+{#if format}
+    <Area handleSubmit=''>
+        <span slot="header">
+            {name}
+        </span>
 
-    <span slot='main'>
-        <form action={action} on:submit|preventDefault={submitFunc} method='POST'>
-            <slot></slot>
-        </form>
-    </span>
-    <p slot="footer">
-        {#if form?.success}
-            <p>{form?.success}</p>
-        {/if}
-        By using the Sanifae service, you agree to the <a href='/tos'>Terms of Service</a>.
-    </p>
-</Area>
+        <span slot='main'>
+            <form action={action} on:submit|preventDefault={submitFunc} method='POST'>
+                <slot></slot>
+            </form>
+        </span>
+        <p slot="footer">
+            {#if form?.success}
+                <p>{form?.success}</p>
+            {/if}
+            By using the Sanifae service, you agree to the <a href='/tos'>Terms of Service</a>.
+        </p>
+    </Area>
+{:else}
+    <form action={action} on:submit|preventDefault={submitFunc} method='POST'>
+        <slot></slot>
+    </form>
+{/if}

src/lib/db/handlers.js

@@ -467,6 +467,20 @@ backend.follow = async ({target}, {user, db}) => {
     return {'success': 'User followed/unfollowed.', 'data': {following, followers}};
 };
 
+backend.bio = async ({bio}, {user, db}) => {
+    var lengthCheck = checkLength(bio,'Post content',1,256);
+
+    if (lengthCheck)
+        return lengthCheck;
+
+    await db.run('UPDATE user SET pinned = ? WHERE username = ?', [
+        bio,
+        user
+    ]) || [];
+
+    return;
+};
+
 backend.messages = async ({isRead}, {user, db}) => {
     var msg = await db.all('SELECT * FROM messages WHERE username = ? ORDER BY time DESC', [
         user

src/lib/util.js

@@ -121,6 +121,7 @@ let formatPostText = function(post) {
 }
 
 let formatPost = function(post, ignoreImg) {
+
     post = post.split('\n');
 
     post = post.map(subPost => {

src/routes/users/[user]/+page.svelte

@@ -3,6 +3,9 @@
     import Area from '$lib/components/Area.svelte';
     import PostList from '$lib/components/PostList.svelte';
     import FileUpload from '$lib/components/FileUpload.svelte';
+    import PostBody from '$lib/components/PostBody.svelte';
+    import Form from '$lib/components/Form.svelte';
+
 
     /** @type {import('./$types').PageData} */
     export let data;
@@ -14,6 +17,8 @@
     let following = data.postJsonUser.following;
     let followers = data.postJsonUser.followers;
 
+    let submitter;
+
     function follow() {
         let fData = (new FormData());
 
@@ -28,6 +33,12 @@
             followers = xJson.followers;
         })
     }
+
+    async function inputHandler(e) {
+        if(!e.key || (e.key == "Enter" && !e.shiftKey)) {
+            submitter.click();
+        }
+    }
 </script>
 
 <style>
@@ -64,6 +75,11 @@
         overflow-y: auto;
     }
 
+    textarea {
+        width: 80%;
+        height: 5rem;
+    }
+
     .sections div:nth-child(1) {
         text-align: left;
     }
@@ -100,7 +116,20 @@
                     </p>
                 </div>
                 <div>
-
+                    {#if data.resAcc.data == userData.username}
+                        <Form action='/api/bio' format={false}>
+                            <textarea class='follower' name='bio' on:mouseleave={inputHandler}  on:click={inputHandler} on:keydown={inputHandler}>
+                                {userData.pinned || ''}
+                            </textarea>
+                            <input type='Submit' hidden='true' bind:this={submitter}>
+                        </Form>
+                    {:else}
+                        <p class='data'>
+                            <span class='follower'>
+                                <PostBody content={userData.pinned || ''} excludeImg={true} />
+                            </span>
+                        </p>
+                    {/if}
                 </div>
             </div>