diff --git a/src/core/client/stream/components/Comment/IndentedComment.css b/src/core/client/stream/components/Comment/IndentedComment.css new file mode 100644 index 000000000..ff0a0fa5f --- /dev/null +++ b/src/core/client/stream/components/Comment/IndentedComment.css @@ -0,0 +1,5 @@ +.blur { + filter: blur(2px); + user-select: none; + pointer-events: none; +} diff --git a/src/core/client/stream/components/Comment/IndentedComment.tsx b/src/core/client/stream/components/Comment/IndentedComment.tsx index 2460f905b..157689517 100644 --- a/src/core/client/stream/components/Comment/IndentedComment.tsx +++ b/src/core/client/stream/components/Comment/IndentedComment.tsx @@ -1,20 +1,25 @@ +import cn from "classnames"; import React, { StatelessComponent } from "react"; import { PropTypesOf } from "talk-framework/types"; import Indent from "../Indent"; import Comment from "./Comment"; +import * as styles from "./IndentedComment.css"; export interface IndentedCommentProps extends PropTypesOf { indentLevel?: number; + blur?: boolean; } const IndentedComment: StatelessComponent = props => { const { indentLevel, ...rest } = props; const CommentElement = ; - const CommentwithIndent = - (indentLevel && {CommentElement}) || - CommentElement; + const CommentwithIndent = ( + + {CommentElement} + + ); return CommentwithIndent; }; diff --git a/src/core/client/stream/components/Comment/__snapshots__/IndentedComment.spec.tsx.snap b/src/core/client/stream/components/Comment/__snapshots__/IndentedComment.spec.tsx.snap index ae2d56dee..91fb1ec96 100644 --- a/src/core/client/stream/components/Comment/__snapshots__/IndentedComment.spec.tsx.snap +++ b/src/core/client/stream/components/Comment/__snapshots__/IndentedComment.spec.tsx.snap @@ -2,6 +2,7 @@ exports[`renders correctly 1`] = ` = props => { return (
{ (environment, { mutation, variables: { @@ -85,7 +86,7 @@ function commit( edge: { cursor: currentDate, node: { - id: uuidGenerator(), + id, createdAt: currentDate, author: { id: me.id, @@ -97,6 +98,9 @@ function commit( clientMutationId: (clientMutationId++).toString(), }, } as any, // TODO: (cvle) generated types should contain one for the optimistic response. + optimisticUpdater: store => { + store.get(id)!.setValue(true, "pending"); + }, configs: getConfig(input), }); } diff --git a/src/core/client/stream/test/__snapshots__/loadMore.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/loadMore.spec.tsx.snap index 2b6612877..1d82d7bb9 100644 --- a/src/core/client/stream/test/__snapshots__/loadMore.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/loadMore.spec.tsx.snap @@ -149,52 +149,56 @@ exports[`loads more comments 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -202,52 +206,56 @@ exports[`loads more comments 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
@@ -255,52 +263,56 @@ exports[`loads more comments 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Isabelle - - -
-
-
- + +
+
+
+ +
@@ -458,52 +470,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -511,52 +527,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
diff --git a/src/core/client/stream/test/__snapshots__/permalinkView.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/permalinkView.spec.tsx.snap index a53c3f1e4..19ba2686a 100644 --- a/src/core/client/stream/test/__snapshots__/permalinkView.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/permalinkView.spec.tsx.snap @@ -24,52 +24,56 @@ exports[`renders permalink view 1`] = ` Show all comments
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -225,52 +229,56 @@ exports[`show all comments 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
diff --git a/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap index 475a485da..931557b1a 100644 --- a/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap @@ -181,52 +181,56 @@ exports[`show all comments 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
diff --git a/src/core/client/stream/test/__snapshots__/postComment.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/postComment.spec.tsx.snap index f4dae1d35..dacf75add 100644 --- a/src/core/client/stream/test/__snapshots__/postComment.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/postComment.spec.tsx.snap @@ -182,52 +182,56 @@ exports[`post a comment: optimistic response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
Hello world!", - } - } - /> -
- + +
+
Hello world!", + } + } + /> +
+ +
@@ -235,52 +239,56 @@ exports[`post a comment: optimistic response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -288,52 +296,56 @@ exports[`post a comment: optimistic response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
@@ -530,52 +542,56 @@ exports[`post a comment: server response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
Hello world! (from server)", - } - } - /> -
- + +
+
Hello world! (from server)", + } + } + /> +
+ +
@@ -583,52 +599,56 @@ exports[`post a comment: server response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -636,52 +656,56 @@ exports[`post a comment: server response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
@@ -878,52 +902,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -931,52 +959,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
diff --git a/src/core/client/stream/test/__snapshots__/postReply.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/postReply.spec.tsx.snap index 0e6c5d219..63360eccb 100644 --- a/src/core/client/stream/test/__snapshots__/postReply.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/postReply.spec.tsx.snap @@ -188,52 +188,56 @@ exports[`post a reply: open reply form 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
- - Lukas - - -
-
-
- + +
+
+
+ +
@@ -610,52 +618,56 @@ exports[`post a reply: optimistic response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
- - Lukas - - -
-
-
- + +
+
+
+ +
@@ -1085,52 +1101,56 @@ exports[`post a reply: server response 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
- - Lukas - - -
-
-
- + +
+
+
+ +
@@ -1439,52 +1463,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -1492,52 +1520,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
diff --git a/src/core/client/stream/test/__snapshots__/renderReplies.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/renderReplies.spec.tsx.snap index 1673675ef..bc69ca2ca 100644 --- a/src/core/client/stream/test/__snapshots__/renderReplies.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/renderReplies.spec.tsx.snap @@ -149,52 +149,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -202,52 +206,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
- - Markus - - -
-
-
- + +
+
+
+ +
@@ -202,52 +206,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Lukas - - -
-
-
- + +
+
+
+ +
diff --git a/src/core/client/stream/test/__snapshots__/showAllReplies.spec.tsx.snap b/src/core/client/stream/test/__snapshots__/showAllReplies.spec.tsx.snap index 235810d26..d8a24d800 100644 --- a/src/core/client/stream/test/__snapshots__/showAllReplies.spec.tsx.snap +++ b/src/core/client/stream/test/__snapshots__/showAllReplies.spec.tsx.snap @@ -149,52 +149,56 @@ exports[`renders comment stream 1`] = ` className="HorizontalGutter-root HorizontalGutter-full" >
- - Markus - - -
-
-
- + +
+
+
+ +
- - Markus - - -
-
-
- + +
+
+
+ +