-
-
Notifications
You must be signed in to change notification settings - Fork 375
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
46 changed files
with
595 additions
and
493 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
26 changes: 0 additions & 26 deletions
26
frontend/app/components/comment/__action/_type/_collapse/comment__action_type_collapse.css
This file was deleted.
Oops, something went wrong.
16 changes: 0 additions & 16 deletions
16
frontend/app/components/comment/__action/comment__action.css
This file was deleted.
Oops, something went wrong.
10 changes: 0 additions & 10 deletions
10
frontend/app/components/comment/__control/_select-label/comment__control_select-label.css
This file was deleted.
Oops, something went wrong.
10 changes: 0 additions & 10 deletions
10
frontend/app/components/comment/__control/_select/comment__control_select.css
This file was deleted.
Oops, something went wrong.
7 changes: 0 additions & 7 deletions
7
frontend/app/components/comment/__control/_view/_inactive/comment__control_view_inactive.css
This file was deleted.
Oops, something went wrong.
7 changes: 0 additions & 7 deletions
7
frontend/app/components/comment/__control/comment__control.css
This file was deleted.
Oops, something went wrong.
16 changes: 0 additions & 16 deletions
16
frontend/app/components/comment/__controls/comment__controls.css
This file was deleted.
Oops, something went wrong.
14 changes: 0 additions & 14 deletions
14
frontend/app/components/comment/__edit-timer/comment__edit-timer.css
This file was deleted.
Oops, something went wrong.
32 changes: 32 additions & 0 deletions
32
frontend/app/components/comment/comment-actions.module.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
.root { | ||
display: flex; | ||
align-items: center; | ||
font-size: 14px; | ||
color: rgb(var(--primary-color)); | ||
} | ||
|
||
.root > * + *, | ||
.additionalActions > * + * { | ||
margin-left: 0.5em; | ||
} | ||
|
||
.countdown { | ||
color: rgb(var(--secondary-darker-text-color)); | ||
} | ||
|
||
@media (hover: hover) { | ||
.additionalActions { | ||
opacity: 0; | ||
transition: opacity 0.15s; | ||
} | ||
|
||
.root:hover .additionalActions { | ||
opacity: 1; | ||
} | ||
} | ||
|
||
.additionalActions::before { | ||
content: '•'; | ||
color: rgb(var(--secondary-text-color)); | ||
margin-right: 0.5em; | ||
} |
143 changes: 143 additions & 0 deletions
143
frontend/app/components/comment/comment-actions.spec.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,143 @@ | ||
import { h } from 'preact'; | ||
import '@testing-library/jest-dom'; | ||
import { CommentActions, Props } from './comment-actions'; | ||
import { render } from 'tests/utils'; | ||
import { screen, waitFor } from '@testing-library/preact'; | ||
|
||
function getProps(): Props { | ||
return { | ||
pinned: false, | ||
admin: false, | ||
currentUser: false, | ||
copied: false, | ||
bannedUser: false, | ||
readOnly: false, | ||
editing: false, | ||
replying: false, | ||
onCopy() {}, | ||
onDelete() {}, | ||
onTogglePin() {}, | ||
onToggleReplying() {}, | ||
onHideUser() {}, | ||
onBlockUser() {}, | ||
onUnblockUser() {}, | ||
onDisableEditing() {}, | ||
editable: false, | ||
editDeadline: undefined, | ||
}; | ||
} | ||
describe('<CommentActions/>', () => { | ||
let props: Props; | ||
|
||
beforeEach(() => { | ||
props = getProps(); | ||
}); | ||
|
||
it('should render "Reply"', () => { | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Reply')).toBeVisible(); | ||
}); | ||
|
||
it('should not render "Reply" in read only mode', () => { | ||
props.readOnly = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.queryByText('Reply')).not.toBeInTheDocument(); | ||
}); | ||
|
||
it('should not render "Cancel" instead "Reply" in replying mode', () => { | ||
props.replying = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.queryByText('Reply')).not.toBeInTheDocument(); | ||
expect(screen.getByText('Cancel')).toBeInTheDocument(); | ||
}); | ||
|
||
it('should render "Hide" on comments not from currentUser', () => { | ||
props.currentUser = false; | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Hide')).toBeVisible(); | ||
}); | ||
|
||
it('should not render "Hide" on comments not from currentUser', () => { | ||
props.currentUser = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.queryByText('Hide')).not.toBeInTheDocument(); | ||
}); | ||
|
||
it('should render "Edit" and timer when editing is available', async () => { | ||
Object.assign(props, { editable: true, editDeadline: Date.now() + 300 * 1000 }); | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Edit')).toBeInTheDocument(); | ||
await waitFor(() => expect(['300s', '299s']).toContain(screen.getByRole('timer').textContent)); | ||
}); | ||
|
||
it('should render "Cancel" instead "Edit" in editing mode', async () => { | ||
Object.assign(props, { editable: true, editing: true, editDeadline: Date.now() + 300 * 1000 }); | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Cancel')).toBeInTheDocument(); | ||
}); | ||
|
||
it.each([ | ||
[{ editable: false, editDeadline: Date.now() + 300 * 1000 }], | ||
[{ editable: true, editDeadline: undefined }], | ||
] as Partial<Props>[][])('should not render "Edit" when editing is not available', (override) => { | ||
Object.assign(props, override); | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Hide')).toBeInTheDocument(); | ||
}); | ||
|
||
it('should render "Delete" for current user comments', () => { | ||
props.currentUser = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Delete')).toBeInTheDocument(); | ||
}); | ||
|
||
it('should not render "Delete" for other users comments', () => { | ||
render(<CommentActions {...props} />); | ||
expect(screen.queryByText('Delete')).not.toBeInTheDocument(); | ||
}); | ||
|
||
describe('admin actions', () => { | ||
it('should render "Copy"', () => { | ||
props.admin = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Copy')).toBeInTheDocument(); | ||
}); | ||
|
||
it('should render "Copied" when comment copied', () => { | ||
Object.assign(props, { admin: true, copied: true }); | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Copied!')).toBeInTheDocument(); | ||
}); | ||
|
||
it('should render "Pin"', () => { | ||
props.admin = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Pin')).toBeInTheDocument(); | ||
}); | ||
|
||
it('should render "Unpin" when comment is pinned', () => { | ||
Object.assign(props, { admin: true, pinned: true }); | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Unpin')).toBeInTheDocument(); | ||
}); | ||
|
||
it.each([[{ currentUser: false, admin: true }], [{ currentUser: true, admin: true }]] as Partial<Props>[][])( | ||
'should render "Delete" on all comments for admin', | ||
(override) => { | ||
Object.assign(props, override); | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByText('Delete')).toBeInTheDocument(); | ||
} | ||
); | ||
|
||
it('should render admin actions in right order', () => { | ||
props.admin = true; | ||
render(<CommentActions {...props} />); | ||
expect(screen.getByTestId('comment-actions-additional').children[0]).toHaveTextContent('Hide'); | ||
expect(screen.getByTestId('comment-actions-additional').children[1]).toHaveTextContent('Copy'); | ||
expect(screen.getByTestId('comment-actions-additional').children[2]).toHaveTextContent('Pin'); | ||
expect(screen.getByTestId('comment-actions-additional').children[3]).toHaveTextContent('Block'); | ||
expect(screen.getByTestId('comment-actions-additional').children[4]).toHaveTextContent('Delete'); | ||
}); | ||
}); | ||
}); |
Oops, something went wrong.