Commit Graph

404 Commits

Author SHA1 Message Date
Simon Backx
90e0ced175 Added separate BlankAvatar component
refs https://github.com/TryGhost/Team/issues/1858
2022-08-31 13:29:01 +02:00
Simon Backx
b701ba9c0d Cleaned up Comment component (#8)
refs https://github.com/TryGhost/Team/issues/1858
fixes https://github.com/TryGhost/Team/issues/1789

- Split up the Comment component in many small Components to make it easier to read and maintain
- Added support for synchronous actions, which are required for actions that affect the context state based on the current value (e.g., increasing a value by one) because of the asynchronous nature of setState:

Before this change
```
// Context state: {hello: 0};
dispatchAction('increaseHelloByOne')
dispatchAction('increaseHelloByOne')
```

Could end up having a state `{hello: 1}` instead of the expected `{hello: 2}`, because underlying this would resolve into:

```
// Context state: {hello: 0};
const hello = {hello: 0};
setState({hello: hello + 1});
setState({hello: hello + 1});
```

Instead of

```
// Context state: {hello: 0};
setState(({hello}) => {hello: hello + 1});
setState(({hello}) => {hello: hello + 1});
```

Synchronous actions now support this.

- Removed deprecated `onAction` context state function
- Replaced the boolean based form checking by the more reliable counter based checking that uses synchronous actions (reason we needed synchronous actions) (fixes https://github.com/TryGhost/Team/issues/1789)
- Prevent creating a new `dispatchAction` function every time the context state changes, by using bind. This prevents infinte updates in `useEffect` hooks that depend on `dispatchAction` and also update the context via actions.
2022-08-30 16:25:40 +02:00
James Morris
3a29a55228 Added eslinting to better manage Tailwind classes 2022-08-30 14:53:35 +01:00
James Morris
455cba4da2 Fixed the transparent background on text input for light mode 2022-08-30 10:38:17 +01:00
Peter Zimon
e95e93618f Refined spacings for paragraphs and blockquotes
- paragraphs had a bit too much bottom margin
- blockquotes missed bottom margin
2022-08-15 12:42:40 +02:00
Simon Backx
c8d4b89ac7 🐛 Added line break on Shift + Enter
refs https://github.com/TryGhost/Team/issues/1793

Included in the @tiptap/extension-hard-break extension.
2022-08-15 12:32:59 +02:00
Simon Backx
2b83af85d1 🐛 Fixed popups not closing correctly
refs https://ghost.slack.com/archives/C02G9E68C/p1660323308235919

- When opening and closing a popup very fast, it will stay in DOM, blocking all pointer events.
- The Headless UI component <Transition show={show}> is not removed from DOM when show is set to true, and false very fast
- Fixed this by forcing a popup to get removed from DOM after 250ms after is has been closed.
- Updated HeadlessUI version
- Moved testing packges to dev dependencies
2022-08-15 10:22:26 +02:00
Simon Backx
e44415eb6f Cleaned up margin syntax 2022-08-12 15:51:35 +02:00
Simon Backx
99ae23cf23 Excluded the last paragraph from bottom margin 2022-08-12 15:50:32 +02:00
James Morris
398a410ba2 Fixed up the paragraph spacing in the editor
no issue
2022-08-12 14:23:18 +01:00
Simon Backx
991e0856b8 Removed unused jsom import 2022-08-12 14:47:31 +02:00
Simon Backx
11c3dcc77a Fixed comment content missing after unhiding them
fixes https://github.com/TryGhost/Team/issues/1786
2022-08-12 14:22:48 +02:00
Simon Backx
de30741fce Added unlike spy 2022-08-12 14:17:35 +02:00
Simon Backx
75510aac5e Added like and unlike tests
refs https://github.com/TryGhost/Team/issues/1780
2022-08-12 14:15:48 +02:00
James Morris
39629145d0 Added in more spacing for the CTAs to catch more ophans
no issue
2022-08-12 13:08:32 +01:00
James Morris
001229801d Fixed up some small dark mode problems
- The loading spinner in dark mode wasn't black
- The action buttons didn't hover correctly in dark mode

no issue
2022-08-12 11:19:01 +01:00
Simon Backx
42d69562d9 Added test for replies and deleted members
refs https://github.com/TryGhost/Team/issues/1780
2022-08-12 11:19:48 +02:00
James Morris
2d79ef7cf9 Fixed local warnings in the terminal when building for comments
no issue
2022-08-12 09:29:29 +01:00
James Morris
fa056be39b Fixed pagination buttons to show singular values properly
refs https://github.com/TryGhost/Team/issues/1782
2022-08-12 08:56:19 +01:00
James Morris
34004cd135 Added in precise fixed width buttons for form
- Reduces large widths of the buttons and so now variable
- Added fixed width to keep button same width when sending

refs https://github.com/TryGhost/Team/issues/1779
2022-08-11 17:14:00 +01:00
James Morris
52cfac284f Added in some spacing to the CTA when there are comments
refs https://github.com/TryGhost/Team/issues/1779
2022-08-11 16:41:57 +01:00
Simon Backx
163367dd93 Removed transformApiSiteData import 2022-08-11 17:29:37 +02:00
Simon Backx
58d32b3c82 Implemented dark mode tests
refs https://github.com/TryGhost/Team/issues/1780
2022-08-11 17:28:41 +02:00
Simon Backx
ef4cfc9b9a Readded auth frame test and improved test structure
refs https://github.com/TryGhost/Team/issues/1780
2022-08-11 17:11:26 +02:00
James Morris
6abd6f6d03 Updated the report dialog to a nicer style
refs https://github.com/TryGhost/Team/issues/1778
2022-08-11 16:07:37 +01:00
Simon Backx
fd21a88d52 Added first basic comments test 2022-08-11 16:40:10 +02:00
James Morris
3b7d26154e Added in the comment border line when replying with no replies
refs https://github.com/TryGhost/Team/issues/1779
2022-08-11 15:35:04 +01:00
James Morris
91134ecb62 Pushed some changes to the profile modal for comments
- Includes a fix to the close button when on mobile
- Has some tweaks suggested by Zimo to bring in line with Portal

refs https://github.com/TryGhost/Team/issues/1779
2022-08-11 15:30:34 +01:00
Simon Backx
24f384b0a2 Fixed calculating if reply form is in viewport 2022-08-11 15:16:36 +02:00
James Morris
e130c2edcd Tweaked non-published comments in dark mode
refs https://github.com/TryGhost/Team/issues/1775
2022-08-11 13:57:35 +01:00
James Morris
1e72a267a3 Pushed a little fix to the dark mode for the comment border
refs https://github.com/TryGhost/Team/issues/1777
2022-08-11 13:53:42 +01:00
Simon Backx
ceaecf43e6 Updated form to only close when another form opens and scroll better
fixes https://github.com/TryGhost/Team/issues/1753
refs https://github.com/TryGhost/Team/issues/1758

- Scroll only if form is not in viewport + scroll to center
- Fixes: You can’t tap reply if another reply box is open (or at least you have to tap a bunch of times)
2022-08-11 14:46:14 +02:00
James Morris
4a0ad8c6bc Little style tweaks to comment replies border and pagination border
refs https://github.com/TryGhost/Team/issues/1777
2022-08-11 12:41:27 +01:00
James Morris
6db7d9bd2d Fixes for super long expertise in form and comments
refs https://github.com/TryGhost/Team/issues/1758
2022-08-11 12:35:38 +01:00
James Morris
5e8ebe44b8 Adding in a subtle border for the comments when it has replies
refs https://github.com/TryGhost/Team/issues/1777
2022-08-11 11:54:28 +01:00
James Morris
9a306a2db2 Posted a few little tweaks to the deleted/hidden comment
refs https://github.com/TryGhost/Team/issues/1775
2022-08-11 11:26:05 +01:00
James Morris
ba8df169ad Changed the markup layout of the comments to fix a positoning problem when expertise is too long on mobile
- When the Expertise is too long, it can cause a broken look to comments on mobile
- Changed how the markup works to better handle the details
2022-08-11 10:09:14 +01:00
James Morris
0cf0c5833a This seems to fix the modal zooming on iOS
refs https://github.com/TryGhost/Team/issues/1758
2022-08-11 09:16:55 +01:00
James Morris
a64f13ae2d Some attempts to fix some issues with comments on mobile
refs https://github.com/TryGhost/Team/issues/1758
2022-08-10 17:36:00 +01:00
James Morris
bcad43c5a4 Added back the padding so comment boxes don't open full width again on desktop
refs https://github.com/TryGhost/Team/issues/1758
2022-08-10 17:36:00 +01:00
James Morris
0ae689dbfb Added a small tweak to CTAs on mobile
refs https://github.com/TryGhost/Team/issues/1754
2022-08-10 17:36:00 +01:00
Simon Backx
94d72c2846 Wired up publication name attribute
fixes https://github.com/TryGhost/Team/issues/1776
2022-08-10 17:34:28 +02:00
Simon Backx
35ed0af99d Fixed releasing mouse outside modals closing it
fixes https://github.com/TryGhost/Team/issues/1769
2022-08-10 16:45:45 +02:00
Simon Backx
bf9e190e15 Added reply pagination (#7)
refs https://github.com/TryGhost/Team/issues/1723

- Moved usage from likes_count to count.likes
- Implemented real reply pagination based by an ID filter
- The backend now returns the relations correctly when creating new comments, so we don't need to fix them any longer.
2022-08-10 16:14:42 +02:00
Simon Backx
b703ddd703 Fixed C keyboard shortcut when input is focused
fixes https://github.com/TryGhost/Team/issues/1767

- Only focus the form if there is no other input focused on the page
2022-08-10 15:46:14 +02:00
James Morris
1640901114 Added in the accent colour to the add details modal for comments
refs https://github.com/TryGhost/Team/issues/1768
2022-08-09 19:12:22 +01:00
James Morris
56facd62aa Adding more tweaks to the modals to ensure works well across platforms
refs https://github.com/TryGhost/Team/issues/1756
2022-08-09 18:58:21 +01:00
James Morris
82cc974549 Updated the copy and logic for the CTAs
refs https://github.com/TryGhost/Team/issues/1754
2022-08-09 18:29:07 +01:00
Fabien "egg" O'Carroll
37db4df98a Added handling for updating comment count based on local actions
refs https://github.com/TryGhost/Team/issues/1761
2022-08-09 13:41:14 +01:00
Fabien "egg" O'Carroll
b908db41d1 Fixed pluralisation for comment count when there is just one 2022-08-09 13:41:14 +01:00
Fabien "egg" O'Carroll
4b453a8b3a Updated comment count to use the /comments/count API
refs https://github.com/TryGhost/Team/issues/1763

We still need to use the pagination for the other checks because these
are based on how many comments are visible, which includes deleted or
hidden comments.

By using the /comments/count API we ensure that any changes to the
calculation of comments is replicated by both the comment_count
helper, as well as the comments-ui
2022-08-09 13:41:14 +01:00
James Morris
3a48518407 Few adjustments to the CTAs
- Keep tweaking the spacing
- Added a plan link for paid CTAs

refs https://github.com/TryGhost/Team/issues/1754
2022-08-09 13:12:08 +01:00
James Morris
20fe790e5d First round of improving the name and bio modal
refs https://github.com/TryGhost/Team/issues/1756
2022-08-09 12:40:59 +01:00
James Morris
2629c5704d Combining the two CTA boxes into one and updating the copy
refs https://github.com/TryGhost/Team/issues/1754
2022-08-09 08:50:10 +01:00
James Morris
ac3dd62e6e Added in a hover state for editng bio
- Improved the affordance for editing bio
- Added a new edit icon for this

refs https://github.com/TryGhost/Team/issues/1756
2022-08-08 16:22:46 +01:00
James Morris
2b2b7c540b First round of CTA and empty state updates based on feedback
- Added in a new line for further explanation
- Adjusted various text sizes and spacings
- Put back in the bottom border
- Currently has a hardcoded publication name for wiring up

refs https://github.com/TryGhost/Team/issues/1754
2022-08-08 15:12:19 +01:00
James Morris
fa9b22e2c6 Removed the left and right spacing around the textbox when there are no comments
refs https://github.com/TryGhost/Team/issues/1752
2022-08-05 14:57:08 +01:00
Simon Backx
a1a0bf6723 Fixed blinking when bluring reply form
fixes https://github.com/TryGhost/Team/issues/1749

Transition syntax was not working, and unused. The transition component also caused a delay, which caused the blinking.
2022-08-05 15:24:38 +02:00
James Morris
a84bcc3d30 Removed the bottom margin from signed out boxes
- After some trying things out, just removed that now
- There should be no more bottom spacing apart from what's in the iFrame now

refs https://github.com/TryGhost/Team/issues/1747
2022-08-05 14:22:24 +01:00
Simon Backx
648ecd6bae Fixed first comment of a post nos showing until a refresh
fixes https://github.com/TryGhost/Team/issues/1748
2022-08-05 15:04:23 +02:00
Simon Backx
5d844b2122 Updated submit keyboard shortcut
refs https://github.com/TryGhost/Team/issues/1725

- CTRL + Enter or CMD + Enter is now supported
- Removed ESC + CMD
2022-08-05 14:58:54 +02:00
James Morris
5b89bd0818 Changed the padding on the iFrame to work better with themes
- There were left over paddings that were present with old design
- Stripping back the paddings to have better placement in more themes without adjustment

refs https://github.com/TryGhost/Team/issues/1747
2022-08-05 10:28:18 +01:00
James Morris
b3a71d8c94 Fixed the avatar icon to only show if there is no image but no name
- This changes the behaviour of the Avatar component to show the icon properly
- This removes a parameter from the Avatar component

refs https://github.com/TryGhost/Team/issues/1746
2022-08-05 09:59:05 +01:00
Simon Backx
1c878615a8 Fixed comments of deleted members throwing error 2022-08-05 10:15:50 +02:00
James Morris
7ecf063b42 Added an icon for when there is no member name on comment box
- This replaces the A that showed which was a bit confusing
- Icon may still change but it feels better than what was there before
- Added new parameter for Avatar component for Blank and Anonymous

refs https://github.com/TryGhost/Team/issues/1746
2022-08-04 17:30:33 +01:00
James Morris
e4e4c07fa0 Change the title of the modal for name and bio for comments
- Trying out a new modal title as it's easier to read
- Also, works better on mobile for the modal

refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 16:49:39 +01:00
James Morris
758651013d Tidying up dialog calls for bio with correct autofocus
- Removed only showing bio in modal, now showing both always
- Changed how the modal is called with parameters to focus on bio if clicked

refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 16:46:22 +01:00
James Morris
4cc2ed88c3 Added in the right character count for bio when bio is present
refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 15:33:52 +01:00
James Morris
5128360df4 Making the buttons work for name and bio in form
refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 15:32:16 +01:00
James Morris
2027c88f58 Correctly used the max length variable for the bio text box in modal
refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 16:25:55 +02:00
James Morris
0a1b1eb70a Added in the max length counter for the bio modal
refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 16:25:55 +02:00
James Morris
1ab2787495 Little tweak to button size on mobile for comments
no issue
2022-08-04 16:25:55 +02:00
Simon Backx
d88b2e582d Wired up editing bio to API
refs https://github.com/TryGhost/Team/issues/1716

- Read bio from member
- Allow editing member
- Sync changed bio across visible comments
2022-08-04 16:25:55 +02:00
James Morris
dd06e31959 Added some rudimentary bio stuff that needs wiring up
- This adds in the bio UI into the modal
- Adds in a simple button for bio under the name in textbox
- Still needs wiring up as it data doesn't save and update yet

refs https://github.com/TryGhost/Team/issues/1716
2022-08-04 16:25:55 +02:00
James Morris
a2597e5584 Added in a explicit time as a title tooltip for relative dates in comments
- Uses the title attribute to pop up the default tooltip
- No helper function introduced to generate explicit date

refs https://github.com/TryGhost/Team/issues/1741
2022-08-03 17:42:20 +01:00
Simon Backx
9b402625ca Added targetOrigin option to postMessage (admin auth)
refs https://github.com/TryGhost/Team/issues/1694
2022-08-03 15:49:16 +02:00
Simon Backx
587e5b887e Added origin check to admin auth frame message listener
refs https://github.com/TryGhost/Team/issues/1694

- Only listen to messages that are coming from the auth iframe
- Related PR for the other side: https://github.com/TryGhost/Ghost/pull/15135
2022-08-03 14:54:13 +02:00
Fabien "egg" O'Carroll
14a9fab688 Removed empty element from DOM when neither title or count are shown
refs https://github.com/TryGhost/Team/issues/1695

This is based on feedback from Sodo!
2022-08-02 22:11:01 +01:00
Simon Backx
c7655ceca0 Added keyboard shortcuts
fixes https://github.com/TryGhost/Team/issues/1725

- ESC to close/blur forms
- CMD + ESC to submit forms
- C to focus and scroll to main comment form
- ESC to close any modals (context menus or dialogs)
- keydown events are passed down from iframes to the main window to prevent having to listen on all iframes + window every time we need these events.
2022-08-02 16:43:48 +02:00
James Morris
551e12000d Removed some commented code to clean up the empty states and CTA
refs https://github.com/TryGhost/Team/issues/1704
2022-08-02 11:35:52 +01:00
Simon Backx
e7338b71d8 Fixed reply box disappearing instantly when add details dialog appears
refs https://github.com/TryGhost/Team/issues/1710
2022-08-02 10:40:54 +02:00
Simon Backx
01e2fbde7c Fixed #ghost-comments-root and renamed it to #ghost-comments
fixes https://github.com/TryGhost/Team/issues/1729
refs https://github.com/TryGhost/Team/issues/1730

Please note that it only works on initial page load for now. Browsers have custom implementations for handling URL hashes/fragments that mess with the scroll position if you reload a page.

We need a special JS based handling of the URL fragment/hash because:
- We should only scroll after the comments have loaded, else we risk landing on a higher position on the page due to content height changes.
- The DIV we scroll to (#ghost-comments-root) is inserted via JS, making it more difficult to scroll to it without JS.
- We cannot wrap the `<script>` tag that loads the comments with a different DIV that has an id where we can scroll to. This would break themes and would make it harder to work with existing CSS grids (tried this first). And we still have the first issue too if we use this.
2022-08-01 16:14:49 +02:00
Djordje Vlaisavljevic
a36233aa8a Updated colors for dark color scheme
refs https://github.com/TryGhost/Team/issues/1704
2022-07-28 20:38:05 +02:00
Fabien "egg" O'Carroll
7d60531709 Fixed the comment count displaying
refs https://github.com/TryGhost/Team/issues/1695

The count param was renamed to showCount in index.js and wasn't
updated elsewhere. This fixes that
2022-07-28 15:37:13 +01:00
Fabien "egg" O'Carroll
5ed16075b7 Fixed title conditional to allow for no title
refs https://github.com/TryGhost/Team/issues/1695

We should allow for an empty string to be passed in as the title,
which means a boolean coercion check is not appropriate, we should
check for null which in this case means to use the default title
2022-07-28 15:34:00 +01:00
Rishabh
beb8807966 Fixed resize observer error in tests
- resize observer used in auth frame is not available in Jest, so we mock it instead
- ignores missing methods on resize observer for tests
2022-07-28 19:01:24 +05:30
Rishabh
9afb36fa53 Disabled context menu edit if editing another comment
refs https://github.com/TryGhost/Team/issues/1710

- if a comment is in edit mode, it stops opening edit for another comment till existing edit mode is exited
2022-07-28 18:50:14 +05:30
Peter Zimon
d28f00656c Updated CTA styles
no issue

- typography and spacing was a bit off in the signup / upgrade CTA boxes
- the line style was inconsistent with the rest of the comments design
- button sizes and spacings needed also a bit of refinement
2022-07-28 14:19:55 +02:00
Fabien 'egg' O'Carroll
f3f6b2a98f Added ability to change title and hide comment count (#3)
refs https://github.com/TryGhost/Team/issues/1695

This allows theme developers to customise the output via the
{{comments}} helper
2022-07-28 12:21:14 +01:00
Peter Zimon
b58970f9e8 Added minor visual improvements
no issue

- applied typography changes to bio and date line as they were too strong
- padding and positioning of the comment input form was a bit misaligned
2022-07-28 13:11:39 +02:00
Peter Zimon
2906018b34 Added spinner to submit button 2022-07-28 12:19:15 +02:00
Rishabh
a10c244e7c Updated member count to use total across pagination
refs https://github.com/TryGhost/Team/issues/1695

- member count was using total comments of current page than all comments across
2022-07-28 00:22:43 +05:30
James Morris
b444500f45 A few dark mode tweaks to make sure it looks nice
refs https://github.com/TryGhost/Team/issues/1703
2022-07-27 14:28:56 +01:00
James Morris
3dd1cb026a Added a truncation for mobile for the comments title 2022-07-27 14:22:45 +01:00
James Morris
c69409cbac Updated the included comment count to be dynamic
- Before it was static, with an X, but now using the variable available
- Do note, this doesn't seem to be showing the right number

refs https://github.com/TryGhost/Team/issues/1695
2022-07-27 14:03:50 +01:00
James Morris
ffabb79703 Added in the title and comments into the Comments repo, rather than in be in the theme only
refs https://github.com/TryGhost/Team/issues/1695
2022-07-27 14:00:20 +01:00
James Morris
457406a86b Added in a cancel button for when replying
refs https://github.com/TryGhost/Team/issues/1703
2022-07-27 13:39:09 +01:00
James Morris
14dedbf95a Brought the pagination style inline with the reply one
refs https://github.com/TryGhost/Team/issues/1703
2022-07-27 13:35:35 +01:00
James Morris
1ff7b15a50 Subtle fade in for comments on render and pagination
refs https://github.com/TryGhost/Team/issues/1703
2022-07-27 11:49:17 +01:00
James Morris
9bd258b461 Commented out Bio stuff for now until it can be wired up
- Please note the commenting out of code here
- We want to put this back in when Bio is available

refs: https://github.com/TryGhost/Team/issues/1716
2022-07-27 11:39:11 +01:00