diff --git a/src/core/client/admin/local/local.graphql b/src/core/client/admin/local/local.graphql index 748bf6201..57ef889ca 100644 --- a/src/core/client/admin/local/local.graphql +++ b/src/core/client/admin/local/local.graphql @@ -1,4 +1,6 @@ -type Local {} +type Local { + authToken: String +} extend type Query { local: Local! diff --git a/src/core/client/stream/components/App.css b/src/core/client/stream/components/App.css index 2bcabb67f..75246e7c6 100644 --- a/src/core/client/stream/components/App.css +++ b/src/core/client/stream/components/App.css @@ -14,3 +14,7 @@ .root { width: 100%; } + +.tabContent { + padding-top: var(--spacing-unit); +} diff --git a/src/core/client/stream/components/App.spec.tsx b/src/core/client/stream/components/App.spec.tsx index dcd979099..2afc61f74 100644 --- a/src/core/client/stream/components/App.spec.tsx +++ b/src/core/client/stream/components/App.spec.tsx @@ -1,14 +1,9 @@ import { shallow } from "enzyme"; import React from "react"; -import { PropTypesOf } from "talk-framework/types"; - -import App from "./App"; +import AppContainer from "../containers/AppContainer"; it("renders comments", () => { - const props: PropTypesOf = { - activeTab: "COMMENTS", - }; - const wrapper = shallow(); + const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); diff --git a/src/core/client/stream/components/App.tsx b/src/core/client/stream/components/App.tsx index 421e6af9c..006914ec8 100644 --- a/src/core/client/stream/components/App.tsx +++ b/src/core/client/stream/components/App.tsx @@ -1,28 +1,57 @@ +import { Localized } from "fluent-react/compat"; import * as React from "react"; import { StatelessComponent } from "react"; +import { + HorizontalGutter, + Tab, + TabBar, + TabContent, + TabPane, +} from "talk-ui/components"; -import { Flex } from "talk-ui/components"; - +import { PropTypesOf } from "talk-ui/types"; +import IfLoggedInContainer from "../containers/IfLoggedInContainer"; import CommentsPaneContainer from "../tabs/comments/containers/CommentsPaneContainer"; +import ProfileQuery from "../tabs/profile/queries/ProfileQuery"; import * as styles from "./App.css"; +type TabValue = "COMMENTS" | "PROFILE" | "%future added value"; + export interface AppProps { - activeTab: "COMMENTS" | "%future added value"; + activeTab: TabValue; + onTabClick: (tab: TabValue) => void; } +const CommentsTab: StatelessComponent> = props => ( + + Comments + +); + +const MyProfileTab: StatelessComponent> = props => ( + + + My Profile + + +); + const App: StatelessComponent = props => { - let view: React.ReactElement; - switch (props.activeTab) { - case "COMMENTS": - view = ; - break; - default: - throw new Error(`Unknown tab ${props.activeTab}`); - } return ( - - {view} - + + + + + + + + + + + + + + ); }; diff --git a/src/core/client/stream/components/HTMLContent.tsx b/src/core/client/stream/components/HTMLContent.tsx index 62bd62b78..a8d20c0ca 100644 --- a/src/core/client/stream/components/HTMLContent.tsx +++ b/src/core/client/stream/components/HTMLContent.tsx @@ -1,3 +1,4 @@ +import cn from "classnames"; import dompurify from "dompurify"; import React, { StatelessComponent } from "react"; @@ -5,11 +6,15 @@ import styles from "./HTMLContent.css"; interface HTMLContentProps { children: string; + className?: string; } -const HTMLContent: StatelessComponent = ({ children }) => ( +const HTMLContent: StatelessComponent = ({ + children, + className, +}) => (
); diff --git a/src/core/client/stream/components/__snapshots__/App.spec.tsx.snap b/src/core/client/stream/components/__snapshots__/App.spec.tsx.snap index d42a5a3d0..9a2441a63 100644 --- a/src/core/client/stream/components/__snapshots__/App.spec.tsx.snap +++ b/src/core/client/stream/components/__snapshots__/App.spec.tsx.snap @@ -1,10 +1,3 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`renders comments 1`] = ` - - - -`; +exports[`renders comments 1`] = ``; diff --git a/src/core/client/stream/containers/AppContainer.tsx b/src/core/client/stream/containers/AppContainer.tsx index 011a0bee8..e3e3918e5 100644 --- a/src/core/client/stream/containers/AppContainer.tsx +++ b/src/core/client/stream/containers/AppContainer.tsx @@ -1,20 +1,33 @@ -import * as React from "react"; -import { StatelessComponent } from "react"; +import React from "react"; import { graphql, withLocalStateContainer } from "talk-framework/lib/relay"; import { AppContainerLocal as Local } from "talk-stream/__generated__/AppContainerLocal.graphql"; +import { + SetActiveTabInput, + SetActiveTabMutation, + withSetActiveTabMutation, +} from "talk-stream/mutations"; import App from "../components/App"; interface InnerProps { local: Local; + setActiveTab: SetActiveTabMutation; } -const AppContainer: StatelessComponent = ({ - local: { activeTab }, -}) => { - return ; -}; +class AppContainer extends React.Component { + private handleSetActiveTab = (tab: SetActiveTabInput["tab"]) => { + this.props.setActiveTab({ tab }); + }; + + public render() { + const { + local: { activeTab }, + } = this.props; + + return ; + } +} const enhanced = withLocalStateContainer( graphql` @@ -22,6 +35,6 @@ const enhanced = withLocalStateContainer( activeTab } ` -)(AppContainer); +)(withSetActiveTabMutation(AppContainer)); export default enhanced; diff --git a/src/core/client/stream/containers/IfLoggedInContainer.tsx b/src/core/client/stream/containers/IfLoggedInContainer.tsx new file mode 100644 index 000000000..d22b8b60a --- /dev/null +++ b/src/core/client/stream/containers/IfLoggedInContainer.tsx @@ -0,0 +1,34 @@ +import React, { Component } from "react"; + +import { graphql, QueryRenderer } from "talk-framework/lib/relay"; +import { IfLoggedInContainerQuery as QueryTypes } from "talk-stream/__generated__/IfLoggedInContainerQuery.graphql"; + +class IfLoggedInContainer extends Component { + public render() { + return ( + + query={graphql` + query IfLoggedInContainerQuery { + me { + id + } + } + `} + render={({ error, props }) => { + if (error) { + return
{error.message}
; + } + + if (props && props.me) { + return <>{this.props.children}; + } + + return null; + }} + variables={{}} + /> + ); + } +} + +export default IfLoggedInContainer; diff --git a/src/core/client/stream/index.tsx b/src/core/client/stream/index.tsx index 7dde43c00..5ba961e83 100644 --- a/src/core/client/stream/index.tsx +++ b/src/core/client/stream/index.tsx @@ -4,8 +4,8 @@ import { StatelessComponent } from "react"; import ReactDOM from "react-dom"; import { createManaged } from "talk-framework/lib/bootstrap"; +import AppContainer from "talk-stream/containers/AppContainer"; -import AppContainer from "./containers/AppContainer"; import { OnPostMessageAuthError, OnPostMessageSetAuthToken, diff --git a/src/core/client/stream/mutations/SetActiveTabMutation.ts b/src/core/client/stream/mutations/SetActiveTabMutation.ts index 8c930dd0c..e7e742042 100644 --- a/src/core/client/stream/mutations/SetActiveTabMutation.ts +++ b/src/core/client/stream/mutations/SetActiveTabMutation.ts @@ -3,7 +3,7 @@ import { commitLocalUpdate, Environment } from "relay-runtime"; import { createMutationContainer, LOCAL_ID } from "talk-framework/lib/relay"; export interface SetActiveTabInput { - tab: "COMMENTS"; + tab: "COMMENTS" | "PROFILE" | "%future added value"; } export type SetActiveTabMutation = (input: SetActiveTabInput) => Promise; diff --git a/src/core/client/stream/mutations/SetCommentIDMutation.ts b/src/core/client/stream/mutations/SetCommentIDMutation.ts index 4bacb1181..eb356286b 100644 --- a/src/core/client/stream/mutations/SetCommentIDMutation.ts +++ b/src/core/client/stream/mutations/SetCommentIDMutation.ts @@ -18,6 +18,7 @@ export async function commit( return commitLocalUpdate(environment, store => { const record = store.get(LOCAL_ID)!; record.setValue(input.id, "commentID"); + record.setValue("COMMENTS", "activeTab"); if (pym) { // This sets the comment id on the parent url. pym.sendMessage("setCommentID", input.id || ""); diff --git a/src/core/client/stream/mutations/index.ts b/src/core/client/stream/mutations/index.ts index 5b39e4e78..3f83af22d 100644 --- a/src/core/client/stream/mutations/index.ts +++ b/src/core/client/stream/mutations/index.ts @@ -27,6 +27,7 @@ export { SetAuthPopupStateMutation, } from "./SetAuthPopupStateMutation"; export { + SetActiveTabInput, withSetActiveTabMutation, SetActiveTabMutation, } from "./SetActiveTabMutation"; diff --git a/src/core/client/stream/tabs/profile/components/CommentsHistory.tsx b/src/core/client/stream/tabs/profile/components/CommentsHistory.tsx new file mode 100644 index 000000000..90cec49ff --- /dev/null +++ b/src/core/client/stream/tabs/profile/components/CommentsHistory.tsx @@ -0,0 +1,36 @@ +import { Localized } from "fluent-react/compat"; +import * as React from "react"; +import { StatelessComponent } from "react"; +import { HorizontalGutter, Typography } from "talk-ui/components"; +import HistoryComment from "./HistoryComment"; + +interface Comment { + id: string; + body: string | null; + createdAt: any; + replyCount: number | null; + asset: { + title: string | null; + }; + conversationURL: string; + onGotoConversation: (e: React.MouseEvent) => void; +} + +interface CommentsHistoryProps { + comments: Comment[]; +} + +const CommentsHistory: StatelessComponent = props => { + return ( + + + Comment History + + {props.comments.map(comment => ( + + ))} + + ); +}; + +export default CommentsHistory; diff --git a/src/core/client/stream/tabs/profile/components/HistoryComment.css b/src/core/client/stream/tabs/profile/components/HistoryComment.css new file mode 100644 index 000000000..3d3af60dd --- /dev/null +++ b/src/core/client/stream/tabs/profile/components/HistoryComment.css @@ -0,0 +1,18 @@ +.icon { + color: var(--palette-text-secondary); +} + +.button, +.replies, +.story { + composes: button from "talk-ui/shared/typography.css"; +} + +.sideBar { + min-width: 180px; + padding-left: var(--spacing-unit); +} + +.body { + word-break: break-all; +} diff --git a/src/core/client/stream/tabs/profile/components/HistoryComment.tsx b/src/core/client/stream/tabs/profile/components/HistoryComment.tsx new file mode 100644 index 000000000..920a5f380 --- /dev/null +++ b/src/core/client/stream/tabs/profile/components/HistoryComment.tsx @@ -0,0 +1,79 @@ +import { Localized } from "fluent-react/compat"; +import * as React from "react"; +import { StatelessComponent } from "react"; +import Timestamp from "talk-stream/components/Timestamp"; +import { + Button, + Flex, + HorizontalGutter, + Icon, + Typography, +} from "talk-ui/components"; +import HTMLContent from "../../../components/HTMLContent"; +import * as styles from "./HistoryComment.css"; + +export interface HistoryCommentProps { + body: string | null; + createdAt: string; + replyCount: number | null; + asset: { + title: string | null; + }; + conversationURL: string; + onGotoConversation: (e: React.MouseEvent) => void; +} + +const HistoryComment: StatelessComponent = props => { + return ( + + + + {props.body && ( + {props.body} + )} + + + + + + + schedule + {props.createdAt} + + + + {!!props.replyCount && ( + + reply + + {"Replies {$replyCount}"} + + + )} + + {"Story: {$title}"} + + + ); +}; + +export default HistoryComment; diff --git a/src/core/client/stream/tabs/profile/components/Profile.tsx b/src/core/client/stream/tabs/profile/components/Profile.tsx new file mode 100644 index 000000000..04e448a23 --- /dev/null +++ b/src/core/client/stream/tabs/profile/components/Profile.tsx @@ -0,0 +1,25 @@ +import * as React from "react"; +import { StatelessComponent } from "react"; +import { PropTypesOf } from "talk-framework/types"; +import UserBoxContainer from "talk-stream/containers/UserBoxContainer"; +import { HorizontalGutter } from "talk-ui/components"; +import CommentsHistoryContainer from "../containers/CommentsHistoryContainer"; + +export interface ProfileProps { + asset: PropTypesOf["asset"]; + me: PropTypesOf["me"] & + PropTypesOf["me"]; +} + +const Profile: StatelessComponent = props => { + return ( + + + {props.me && ( + + )} + + ); +}; + +export default Profile; diff --git a/src/core/client/stream/tabs/profile/containers/CommentsHistoryContainer.tsx b/src/core/client/stream/tabs/profile/containers/CommentsHistoryContainer.tsx new file mode 100644 index 000000000..3056a488b --- /dev/null +++ b/src/core/client/stream/tabs/profile/containers/CommentsHistoryContainer.tsx @@ -0,0 +1,70 @@ +import React from "react"; +import { graphql } from "react-relay"; + +import { getURLWithCommentID } from "talk-framework/helpers"; +import { withFragmentContainer } from "talk-framework/lib/relay"; +import { CommentsHistoryContainer_asset as AssetData } from "talk-stream/__generated__/CommentsHistoryContainer_asset.graphql"; +import { CommentsHistoryContainer_me as CommentsData } from "talk-stream/__generated__/CommentsHistoryContainer_me.graphql"; +import { + SetCommentIDMutation, + withSetCommentIDMutation, +} from "talk-stream/mutations"; +import CommentsHistory from "../components/CommentsHistory"; + +interface CommentsHistoryContainerProps { + setCommentID: SetCommentIDMutation; + me: CommentsData; + asset: AssetData; +} + +export class CommentsHistoryContainer extends React.Component< + CommentsHistoryContainerProps +> { + private onGoToConversation = (id: string) => { + this.props.setCommentID({ id }); + }; + public render() { + const comments = this.props.me.comments.edges.map(edge => ({ + ...edge.node, + conversationURL: getURLWithCommentID(edge.node.asset.url, edge.node.id), + onGotoConversation: (e: React.MouseEvent) => { + if (this.props.asset.id === edge.node.asset.id) { + this.onGoToConversation(edge.node.id); + e.preventDefault(); + } + }, + })); + return ; + } +} + +const enhanced = withSetCommentIDMutation( + withFragmentContainer({ + asset: graphql` + fragment CommentsHistoryContainer_asset on Asset { + id + } + `, + me: graphql` + fragment CommentsHistoryContainer_me on User { + comments { + edges { + node { + id + body + createdAt + replyCount + asset { + id + title + url + } + } + } + } + } + `, + })(CommentsHistoryContainer) +); + +export default enhanced; diff --git a/src/core/client/stream/tabs/profile/containers/ProfileContainer.tsx b/src/core/client/stream/tabs/profile/containers/ProfileContainer.tsx new file mode 100644 index 000000000..716ce75bc --- /dev/null +++ b/src/core/client/stream/tabs/profile/containers/ProfileContainer.tsx @@ -0,0 +1,34 @@ +import React from "react"; +import { graphql } from "react-relay"; + +import { withFragmentContainer } from "talk-framework/lib/relay"; +import { ProfileContainer_asset as AssetData } from "talk-stream/__generated__/ProfileContainer_asset.graphql"; +import { ProfileContainer_me as MeData } from "talk-stream/__generated__/ProfileContainer_me.graphql"; + +import Profile from "../components/Profile"; + +interface ProfileContainerProps { + me: MeData; + asset: AssetData; +} + +export class StreamContainer extends React.Component { + public render() { + return ; + } +} +const enhanced = withFragmentContainer({ + asset: graphql` + fragment ProfileContainer_asset on Asset { + ...CommentsHistoryContainer_asset + } + `, + me: graphql` + fragment ProfileContainer_me on User { + ...UserBoxContainer_me + ...CommentsHistoryContainer_me + } + `, +})(StreamContainer); + +export default enhanced; diff --git a/src/core/client/stream/tabs/profile/queries/ProfileQuery.tsx b/src/core/client/stream/tabs/profile/queries/ProfileQuery.tsx new file mode 100644 index 000000000..e98212f77 --- /dev/null +++ b/src/core/client/stream/tabs/profile/queries/ProfileQuery.tsx @@ -0,0 +1,80 @@ +import { Localized } from "fluent-react/compat"; +import React, { StatelessComponent } from "react"; +import { ReadyState } from "react-relay"; + +import { + graphql, + QueryRenderer, + withLocalStateContainer, +} from "talk-framework/lib/relay"; +import { ProfileQuery as QueryTypes } from "talk-stream/__generated__/ProfileQuery.graphql"; +import { ProfileQueryLocal as Local } from "talk-stream/__generated__/ProfileQueryLocal.graphql"; +import { Spinner } from "talk-ui/components"; + +import ProfileContainer from "../containers/ProfileContainer"; + +interface InnerProps { + local: Local; +} + +export const render = ({ + error, + props, +}: ReadyState) => { + if (error) { + return
{error.message}
; + } + + if (props) { + if (!props.me) { + return ( + +
Error loading profile
+ + ); + } + if (!props.asset) { + return ( + +
Asset not found
+ + ); + } + return ; + } + + return ; +}; + +const ProfileQuery: StatelessComponent = ({ + local: { assetID, assetURL }, +}) => ( + + query={graphql` + query ProfileQuery($assetID: ID, $assetURL: String) { + asset(id: $assetID, url: $assetURL) { + ...ProfileContainer_asset + } + me { + ...ProfileContainer_me + } + } + `} + variables={{ + assetID, + assetURL, + }} + render={render} + /> +); + +const enhanced = withLocalStateContainer( + graphql` + fragment ProfileQueryLocal on Local { + assetID + assetURL + } + ` +)(ProfileQuery); + +export default enhanced; diff --git a/src/core/client/stream/test/comments/__snapshots__/editComment.spec.tsx.snap b/src/core/client/stream/test/comments/__snapshots__/editComment.spec.tsx.snap index b24ef514d..6c88f64cf 100644 --- a/src/core/client/stream/test/comments/__snapshots__/editComment.spec.tsx.snap +++ b/src/core/client/stream/test/comments/__snapshots__/editComment.spec.tsx.snap @@ -2,576 +2,123 @@ exports[`cancel edit: edit canceled 1`] = `
-
+ + + +
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
+ Signed in as - Powered by - - ⁨The Coral Project⁩ - + Markus + .
- -
-
- -
-
-
-
-
-
-
- - Markus - -
- -
-
-
- -
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
- - Lukas - -
- -
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-`; - -exports[`edit a comment: edit form 1`] = ` -
-
-
-
-
-
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
-
- - Powered by - - ⁨The Coral Project⁩ - + + Not you?  +
-
- -
-
-
-
-
- - Markus - - -
-
+
- - - Edit: - - remaining - -
-
- + Powered by + + ⁨The Coral Project⁩ + + +
- - Lukas -
- + Markus + +
+ +
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
-
- +
+ +
+
+
+
+
+
+ +
@@ -777,236 +405,620 @@ exports[`edit a comment: edit form 1`] = `
-
+
+
+`; + +exports[`edit a comment: edit form 1`] = ` +
+
    + + +
+
+
+
+
+
+
+ Signed in as + + Markus + + . +
+
+ + Not you?  + + +
+
+
+
+
+
+ +
+
+
+ + + +
+ +
+
+
+
+
+
+ + Powered by + + ⁨The Coral Project⁩ + + +
+ +
+
+ +
+
+
+
+
+
+
+ + Markus + + +
+
+
+ +
+
+
+ + + +
+
+
+
+
+
+ + + Edit: + + remaining + +
+
+ + +
+
+ +
+
+
+
+
+
+
+ + Lukas + +
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
`; exports[`edit a comment: optimistic response 1`] = `
-
+ + + +
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
+ Signed in as - Powered by - - ⁨The Coral Project⁩ - + Markus + .
- + + Not you?  + + +
-
-
-
-
-
-
- - Markus - - -
-
+
- - - Edit: - - remaining - -
-
- + Powered by + + ⁨The Coral Project⁩ + + +
-
-
+
- Lukas + Markus -
-
+
+
+ +
+
+
- 2018-07-06T18:20:00.000Z - + + + +
+
+ + + Edit: + + remaining + +
+
+ + +
+
+ +
+
+
+
+
-
- +
+ +
+
+
+
+
+
+ +
@@ -1205,1304 +1373,136 @@ exports[`edit a comment: optimistic response 1`] = `
-
+
`; exports[`edit a comment: render stream 1`] = `
-
+ + + +
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
+ Signed in as - Powered by - - ⁨The Coral Project⁩ - + Markus + .
- -
-
- -
-
-
-
-
-
-
- - Markus - -
- -
-
-
- -
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
- - Lukas - -
- -
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-`; - -exports[`edit a comment: server response 1`] = ` -
-
-
-
-
-
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
-
- - Powered by - - ⁨The Coral Project⁩ - + + Not you?  -
- -
-
- -
-
-
-
-
-
-
-
- - Markus - -
- -
- ( - - Edited - - ) -
-
-
-
- -
-
-
-
-
- -
-
+ Sign Out +
-
-
-
-
-
-
-
- - Lukas - -
- -
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-`; - -exports[`shows expiry message: edit form closed 1`] = ` -
-
-
-
-
-
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
-
- - Powered by - - ⁨The Coral Project⁩ - - -
- -
-
- -
-
-
-
-
-
-
-
- - Markus - -
- -
-
-
- -
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
- - Lukas - -
- -
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-`; - -exports[`shows expiry message: edit time expired 1`] = ` -
-
-
-
-
-
- Signed in as - - Markus - - . -
-
- - Not you?  - - -
-
-
-
-
-
- -
-
-
- - - -
- -
-
-
-
-
-
- - Powered by - - ⁨The Coral Project⁩ - - -
- -
-
- -
-
-
-
-
- - Markus - - -
-
+
-
+ +
+
+ +
+
+
+
+
+
+
+
+ + Markus + +
+ +
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ + Lukas + +
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+`; + +exports[`edit a comment: server response 1`] = ` +
+
    + + +
+
+
+
+
+
+
+ Signed in as + + Markus - Edit time has expired. You can no longer edit this comment. Why not post another one? + .
+ + Not you?  + +
+
+
+
+
+
+ +
+
+
+ + + +
+ +
+
+
+
+
+
+ + Powered by + + ⁨The Coral Project⁩ + + +
+
- - Lukas -
- + Markus + +
+ +
+ ( + + Edited + + ) +
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
-
- +
+ +
+
+
+
+
+
+ +
@@ -2678,6 +2200,876 @@ exports[`shows expiry message: edit time expired 1`] = `
-
+
+
+`; + +exports[`shows expiry message: edit form closed 1`] = ` +
+
    + + +
+
+
+
+
+
+
+ Signed in as + + Markus + + . +
+
+ + Not you?  + + +
+
+
+
+
+
+ +
+
+
+ + + +
+ +
+
+
+
+
+
+ + Powered by + + ⁨The Coral Project⁩ + + +
+ +
+
+ +
+
+
+
+
+
+
+
+ + Markus + +
+ +
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ + Lukas + +
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+`; + +exports[`shows expiry message: edit time expired 1`] = ` +
+
    + + +
+
+
+
+
+
+
+ Signed in as + + Markus + + . +
+
+ + Not you?  + + +
+
+
+
+
+
+ +
+
+
+ + + +
+ +
+
+
+
+
+
+ + Powered by + + ⁨The Coral Project⁩ + + +
+ +
+
+ +
+
+
+
+
+
+
+ + Markus + + +
+
+
+ +
+
+
+ + + +
+
+
+
+
+
+ + Edit time has expired. You can no longer edit this comment. Why not post another one? +
+
+ +
+
+ +
+
+
+
+
+
+
+ + Lukas + +
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
`; diff --git a/src/core/client/stream/test/comments/__snapshots__/loadMore.spec.tsx.snap b/src/core/client/stream/test/comments/__snapshots__/loadMore.spec.tsx.snap index d63ce2df8..0488adfd4 100644 --- a/src/core/client/stream/test/comments/__snapshots__/loadMore.spec.tsx.snap +++ b/src/core/client/stream/test/comments/__snapshots__/loadMore.spec.tsx.snap @@ -2,674 +2,21 @@ exports[`loads more comments 1`] = `
-
-