a tool for shared writing and social publishing
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

add iosbs to commentbox

+37 -4
+37 -4
app/lish/[did]/[publication]/[rkey]/Interactions/Comments/CommentBox.tsx
··· 10 10 import { 11 11 MutableRefObject, 12 12 RefObject, 13 + useEffect, 13 14 useLayoutEffect, 14 15 useRef, 15 16 useState, ··· 23 24 import { setMark } from "src/utils/prosemirror/setMark"; 24 25 import { multi } from "linkifyjs"; 25 26 import { Json } from "supabase/database.types"; 27 + import { isIOS } from "src/utils/isDevice"; 26 28 27 29 export function CommentBox(props: { 28 30 doc_uri: string; ··· 89 91 let [loading, setLoading] = useState(false); 90 92 return ( 91 93 <div className=" flex flex-col gap-1"> 92 - <pre 93 - ref={mountRef} 94 - className={`border whitespace-pre-wrap input-with-border min-h-32 h-fit`} 95 - /> 94 + <div className="w-full relative"> 95 + <pre 96 + ref={mountRef} 97 + className={`border whitespace-pre-wrap input-with-border min-h-32 h-fit`} 98 + /> 99 + <IOSBS view={view} /> 100 + </div> 96 101 <div className="flex justify-between"> 97 102 <div className="flex gap-1"> 98 103 <TextDecorationButton ··· 142 147 </ButtonPrimary> 143 148 </div> 144 149 </div> 150 + ); 151 + } 152 + 153 + export function IOSBS(props: { view: RefObject<EditorView | null> }) { 154 + let [initialRender, setInitialRender] = useState(true); 155 + useEffect(() => { 156 + setInitialRender(false); 157 + }, []); 158 + if (initialRender || !isIOS()) return null; 159 + return ( 160 + <div 161 + className="h-full w-full absolute cursor-text group-focus-within:hidden py-[18px]" 162 + onPointerUp={(e) => { 163 + if (!props.view.current) return; 164 + e.preventDefault(); 165 + 166 + let pos = props.view.current.posAtCoords({ 167 + top: e.clientY, 168 + left: e.clientX, 169 + }); 170 + 171 + let tr = props.view.current.state.tr; 172 + props.view.current.dispatch( 173 + tr.setSelection(TextSelection.create(tr.doc, pos?.pos || 1)), 174 + ); 175 + props.view.current.focus(); 176 + }} 177 + /> 145 178 ); 146 179 } 147 180