Commit Graph

24 Commits

Author SHA1 Message Date
Sinclair Chen
20fd286756
Fix link classes duplicating on paste (#788) 2022-08-22 17:45:23 -07:00
Sinclair Chen
df858f916b
Migrate daisy tooltips to our own to fix cutoffs (#748)
* Make all tooltips use our component

* Stop mobile tooltip crop (daisy -> floating-ui)

* Show tooltip on tap for touch devices

Except tooltips on buttons

* migrate another daisy tooltip to ours

* Prevent hidden tooltip from covering click/hover
2022-08-12 12:04:23 -07:00
Austin Chen
9311652bed
Support Youtube, Tweet, and Metaculus embeds in editor (#744)
* Embed a tweet by URL

* Clean up imports

* Prevent tweetId from getting interpreted as a number

* Use a single place to embed iframe, Youtube, and Tweets

* Support Manifold and Metaculus embeds

* Remove unused import

* Simplify Manifold paste logic

* Clean up embed rewrite code

* Add back comment

* Rejigger config so tsx is only in web/

* Clean up comment

* Revert unnecessary tsconfig change

* Fix placeholder

* Lighten placeholder
2022-08-11 20:18:01 -07:00
Austin Chen
dc95587cca
Add editor toolbar to choose and embed markets (#702)
* Embed markets using the "add markets" template

* Override dev domain

* Improve market modal style

- contract searchbar now sticky
- entire card clickable to select (if quickbet is hidden)
- adjust selected card styles

* remove extra export

* Hide pills

* Fix browser redirect warning

* Insert all markets instead of just one

* fix type error

* fixup "Insert all markets instead of just one"

Co-authored-by: Sinclair Chen <abc.sinclair@gmail.com>
2022-08-11 14:32:02 -07:00
Austin Chen
b5b77be188 Accept URLs in the iframe editor
TODO: Update placeholder text to mention this
2022-08-10 11:03:39 -07:00
Sinclair Chen
0b9ca6b7ee
Editor improvements (#735)
* Allow focus on all parts of editor

* Fix background and text colors

* Restrict height of image in comment

* Remove "Type *markdown*" placeholder

it's a little misleading (can't do markdown links) and messes with focus

to be replaced with a highlight menu in the future
2022-08-09 19:04:55 -07:00
Sinclair Chen
914fc476ce
Remove top/bottom margin from indented list items (#733) 2022-08-09 10:17:44 -07:00
Sinclair Chen
5892ccee97
Rich text in comments, fixed (#719)
* Revert "Revert "Switch comments/chat to rich text editor (#703)""

This reverts commit 33906adfe4.

* Fix typing after being weird on Android

Issue: character from mention gets deleted. Most weird on Swiftkey:
mention gets duplicated instead of deleting.

See https://github.com/ProseMirror/prosemirror/issues/565
https://bugs.chromium.org/p/chromium/issues/detail?id=612446

The keyboard still closes unexpectedly when you delete :(

* On reply, put space instead of \n after mention

* Remove image upload from placeholder text

- Redundant with image upload button
- Too long on mobile

* fix dependency
2022-08-06 13:39:52 -07:00
James Grugett
33906adfe4 Revert "Switch comments/chat to rich text editor (#703)"
This reverts commit f52da72115.
2022-08-04 16:49:59 -07:00
Sinclair Chen
f52da72115
Switch comments/chat to rich text editor (#703)
* Switch comments/chat to rich text editor

* Remove TruncatedComment

* Re-add submit on enter

* Insert at mention on reply

* Update editor style for send button

* only submit on enter in chat

* code review: refactor

* use more specific type for upload

* fix ESlint and errors from merge

* fix trigger on every render eslint warning

* Notify people mentioned in comment

* fix type errors
2022-08-04 16:34:04 -07:00
Sinclair Chen
6c89e5f18f
Add @ mentions to editor (#670)
* Add @ mentions to editor

* Fix mention list not loading

* Sort mention list by prefix, follow count

* Render at mention with Linkify component

- mentions are now Next <Link> rather than <a>
- fix bug where editor.getText() returns [object Object] for mentions
- fix mention rendering for posted markets
2022-07-23 20:37:34 -07:00
Austin Chen
71880dfc98
Add a toolbar for images and iframes (#688)
* Add a toolbar for images and iframes

* Insert embed code via modal
2022-07-23 09:19:49 -07:00
Austin Chen
7cace82b83
Render iframes inside the rich text editor (#682)
* Try embedding iframes in tiptap

* When iframe code is pasted, inject it into the editor

* Code cleanups and comments

* Remove clsx dependency

Cuz it doesn't exist in `common` anyways

* Rename to tiptap-iframe
2022-07-22 09:12:23 -07:00
Sinclair Chen
781de79b97 Make description text style more consistent
- links and blockquotes have light font weight, like other text
- font size in editor matches font size in description
- old descriptions have same style as new
- placeholder text matches editor style
- decrease line-height a bit
2022-07-18 14:03:05 -07:00
Austin Chen
f393246e4f
Let users edit descriptions and questions (#654)
* Use rich text editor on the description

* Write a new line to description when the question is changed

* Stop showing categories

* Allow anyone to edit their own question
2022-07-17 22:22:44 -07:00
Austin Chen
60f4e43cf3 Prettier fix 2022-07-16 12:51:22 -07:00
Austin Chen
32cb19d01f Randomize image upload path to avoid collisions 2022-07-16 11:39:58 -07:00
Austin Chen
1bc49dc0a2 Tweak placeholder copy 2022-07-16 11:39:58 -07:00
Austin Chen
349772a2f9 Description typography: font-light, text-base 2022-07-16 11:39:58 -07:00
Austin Chen
916618be31 Disable quotation marks in quotes 2022-07-16 11:39:58 -07:00
Sinclair Chen
095af10d4f replace raw checkbox w/ Checkbox component
also run prettier
2022-07-13 16:50:08 -07:00
Sinclair Chen
98192ee580 simplify rich text link styles 2022-07-13 16:14:44 -07:00
Sinclair Chen
664e55a40b
Add typing, pasting links (#646) 2022-07-13 15:56:15 -07:00
Sinclair Chen
9a11f55762
Rich content (#620)
* Add TipTap editor and renderer components

* Change market description editor to rich text

* Type description as JSON, fix string-based logic

- Delete make-predictions.tsx
- Delete feed logic that showed descriptions

* wip Fix API validation

* fix type error

* fix extension import (backend)

In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`

Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *

If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.

* Stop load on fail create market, improve warning

* Refactor editor as hook / fix infinite submit bug

Move state of editor back up to parent
We have to do this later anyways to allow parent to edit

* Add images - display, paste + uploading

* add uploading state of image

* Fix placeholder, misc styling

min height, quote

* Fix appending to description

* code review fixes: rename, refactor, chop carets

* Add hint & upload button on new lines

- bump to Tailwind 3.1 for arbitrary variants

* clean up, run prettier

* rename FileButton to FileUploadButton

* add image extension as functions dependency
2022-07-13 11:58:22 -07:00