From 92c5303d81e4051c9f4e7a54fbdea6cb3608a4ea Mon Sep 17 00:00:00 2001
From: rleed <101502594+rleed@users.noreply.github.com>
Date: Sun, 22 Oct 2023 12:55:50 -0300
Subject: [PATCH] Add optional text input for link posts (#558)

* add link comment functionality

* handle anon case

* revise info text

* simplify by using item.text

* remove hint

* cleanup

---------

Co-authored-by: rleed <rleed1@pm.me>
---
 api/typeDefs/item.js        |  2 +-
 components/adv-post-form.js | 25 ++++++++++++++++++++++---
 components/link-form.js     |  8 ++++----
 3 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/api/typeDefs/item.js b/api/typeDefs/item.js
index b78077eb..1b10eaf0 100644
--- a/api/typeDefs/item.js
+++ b/api/typeDefs/item.js
@@ -26,7 +26,7 @@ export default gql`
     bookmarkItem(id: ID): Item
     subscribeItem(id: ID): Item
     deleteItem(id: ID): Item
-    upsertLink(id: ID, sub: String, title: String!, url: String!, boost: Int, forward: [ItemForwardInput], hash: String, hmac: String): Item!
+    upsertLink(id: ID, sub: String, title: String!, url: String!, text: String, boost: Int, forward: [ItemForwardInput], hash: String, hmac: String): Item!
     upsertDiscussion(id: ID, sub: String, title: String!, text: String, boost: Int, forward: [ItemForwardInput], hash: String, hmac: String): Item!
     upsertBounty(id: ID, sub: String, title: String!, text: String, bounty: Int, hash: String, hmac: String, boost: Int, forward: [ItemForwardInput]): Item!
     upsertJob(id: ID, sub: String!, title: String!, company: String!, location: String, remote: Boolean,
diff --git a/components/adv-post-form.js b/components/adv-post-form.js
index 4345ce58..732d58c5 100644
--- a/components/adv-post-form.js
+++ b/components/adv-post-form.js
@@ -1,5 +1,5 @@
 import AccordianItem from './accordian-item'
-import { Input, InputUserSuggest, VariableInput, Checkbox } from './form'
+import { MarkdownInput, Input, InputUserSuggest, VariableInput, Checkbox } from './form'
 import InputGroup from 'react-bootstrap/InputGroup'
 import { BOOST_MIN, BOOST_MULT, MAX_FORWARDS } from '../lib/constants'
 import { DEFAULT_CROSSPOSTING_RELAYS } from '../lib/nostr'
@@ -11,14 +11,15 @@ import { useRouter } from 'next/router'
 
 const EMPTY_FORWARD = { nym: '', pct: '' }
 
-export function AdvPostInitial ({ forward, boost }) {
+export function AdvPostInitial ({ text, forward, boost }) {
   return {
+    text: text || '',
     boost: boost || '',
     forward: forward?.length ? forward : [EMPTY_FORWARD]
   }
 }
 
-export default function AdvPostForm () {
+export default function AdvPostForm ({ isLink }) {
   const me = useMe()
   const router = useRouter()
 
@@ -27,6 +28,24 @@ export default function AdvPostForm () {
       header={<div style={{ fontWeight: 'bold', fontSize: '92%' }}>options</div>}
       body={
         <>
+          {isLink &&
+            <MarkdownInput
+              label={
+                <div className='d-flex align-items-center'>text
+                  <Info>
+                    <span className='fw-bold'>You can use this text to ...</span>
+                    <ul>
+                      <li>provide context</li>
+                      <li>summarize the link</li>
+                      <li>spur great conversation!</li>
+                      <li>or for anything else that comes to your mind</li>
+                    </ul>
+                  </Info>
+                </div>
+              }
+              name='text'
+              minRows={6}
+            />}
           <Input
             label={
               <div className='d-flex align-items-center'>boost
diff --git a/components/link-form.js b/components/link-form.js
index 8770bb50..d25d9d29 100644
--- a/components/link-form.js
+++ b/components/link-form.js
@@ -70,8 +70,8 @@ export function LinkForm ({ item, sub, editThreshold, children }) {
 
   const [upsertLink] = useMutation(
     gql`
-      mutation upsertLink($sub: String, $id: ID, $title: String!, $url: String!, $boost: Int, $forward: [ItemForwardInput], $hash: String, $hmac: String) {
-        upsertLink(sub: $sub, id: $id, title: $title, url: $url, boost: $boost, forward: $forward, hash: $hash, hmac: $hmac) {
+      mutation upsertLink($sub: String, $id: ID, $title: String!, $url: String!, $text: String, $boost: Int, $forward: [ItemForwardInput], $hash: String, $hmac: String) {
+        upsertLink(sub: $sub, id: $id, title: $title, url: $url, text: $text, boost: $boost, forward: $forward, hash: $hash, hmac: $hmac) {
           id
         }
       }`
@@ -123,7 +123,7 @@ export function LinkForm ({ item, sub, editThreshold, children }) {
       initial={{
         title: item?.title || shareTitle || '',
         url: item?.url || shareUrl || '',
-        ...AdvPostInitial({ forward: normalizeForwards(item?.forwards), boost: item?.boost }),
+        ...AdvPostInitial({ text: item?.text, forward: normalizeForwards(item?.forwards), boost: item?.boost }),
         ...SubSelectInitial({ sub: item?.subName || sub?.name })
       }}
       schema={schema}
@@ -185,7 +185,7 @@ export function LinkForm ({ item, sub, editThreshold, children }) {
           }
         }}
       />
-      <AdvPostForm edit={!!item} />
+      <AdvPostForm edit={!!item} isLink />
       <div className='mt-3'>
         {item
           ? (