Implemented editing message #402

kunall17 · 2017-03-05T23:26:12Z

Currently I used onLongPress, ideally this should be place in a menu (ActionSheet for IOS) hence when #378 will be completed i'll create an option there in 04cd5f4 :)

smarx · 2017-03-05T23:26:14Z

Automated message from Dropbox CLA bot

@kunall17, it looks like you've already signed the Dropbox CLA. Thanks!

borisyankov · 2017-03-07T11:54:03Z

src/message/MessageContainer.js

+    const { auth, message, pushRoute, popRoute } = this.props;
+    if (isSentByYou(auth, message)) {
+      pushRoute('');
+      fetchRawMessage(auth, message.id, (res) => {


We do use async/await and not callbacks.
It should be in the form of:

const res = await fetchRawMessage(auth, message.id);

borisyankov · 2017-03-07T18:26:42Z

Right arrow in the modal title bar is not a standard UI for iOS/Android.
We would have wanted it as a button somewhere, either an icon or a text saying 'Update'.

But, in that specific case, I think we want to implement it as Slack does: the compose box becomes filled with the message text, and then the icon for send optionally might change (or not).

kunall17 · 2017-03-07T18:42:10Z

The slack one looks really cool, i'll implement something like that!

kunall17 · 2017-03-13T14:39:46Z

@borisyankov updated the branch,
I have to add a loading message (for fetching raw message and patching message) so for that should I use the routes and the default LoadingScreen or some other dialog (popup) for loading?

Screencast:

coveralls · 2017-04-07T10:09:43Z

Coverage decreased (-1.5%) to 55.54% when pulling c25f27a on kunall17:patch-1 into cce5ee4 on zulip:master.

zulipbot · 2017-05-05T14:13:27Z

@kunall17, your pull request has developed a merge conflict! Please review the most recent commit (1c201dd) for conflicting changes and resolve your pull request's merge conflicts.

kunall17 · 2017-05-07T10:32:02Z

@borisyankov Updated the PR!

borisyankov · 2017-05-08T11:31:41Z

Cool. It works reasonably well right now, I'll do a more thorough review of the code itself.
One functional improvement: when the user clicks 'Edit Message' - focus on the ComposeText.

We might also want to add a cancel button. We should discuss it.

borisyankov · 2017-05-08T11:47:51Z

And we should either add a progress bar for the update, or do optimistic UI update which @nashvail worked on for the Reactions. We'll need to discuss that too.

borisyankov · 2017-05-08T11:34:59Z

src/api/editMessage.js

@@ -0,0 +1,15 @@
+import { apiPatch } from './apiFetch';


Would the name of the actual API call be 'updateMessage'?

The reason is that 'edit' is more of a continuous action while update sound more like a command. Makes sense?

Yeah, makes sense

borisyankov · 2017-05-08T11:36:18Z

src/api/editMessage.js

+    {
+      content
+    },
+    res => res,


Use this to return a more concrete field if only one is relevant which likely is the case.
Maybe res.content or even res.content.raw_content?

The result is not being used anywhere, I'll remove it

borisyankov · 2017-05-08T11:39:58Z

src/common/Icons.js

@@ -17,5 +17,6 @@ export const IconStream = (props) => <FontAwesomeIcon name="hashtag" {...props}
 export const IconPrivate = (props) => <FontAwesomeIcon name="lock" {...props} />;
 export const IconPrivateChat = (props) => <IoniconsIcon name="md-text" {...props} />;
 export const IconDownArrow = (props) => <IoniconsIcon name="md-arrow-down" {...props} />;
+export const IconEdit = (props) => <MaterialIcon name="done" {...props} />;


Maybe 'IconOK' or 'IconDone' ?

borisyankov · 2017-05-08T11:49:06Z

src/utils/message.js

@@ -51,3 +51,6 @@ export const shouldBeMuted = (msg, narrow, subscriptions, mutes = []): boolean =

  return mutes.some(x => x[0] === msg.display_recipient && x[1] === msg.subject);
 };
+
+export const isSentByYou = (message, auth): boolean =>
+  auth.email === message.sender_email;


Maybe an overkill to extract that to a function?

Would have suggested isSentBySelf as a name, but am suggesting to inline the logic.

I'll inline the logic!

borisyankov · 2017-05-08T11:52:23Z

src/message/messageActionSheet.js

+const isSentByYouAndNarrowed = (message, auth, narrow) =>
+  isSentByYou(message, auth) && !isHomeNarrow(narrow);
+
+const actionSheetButtons = [


Nice, I was thinking to add exactly that, but decided not to for now. Still like it a lot ;)

borisyankov · 2017-05-08T11:55:05Z

src/message/MessageList.js

@@ -17,6 +17,11 @@ const styles = StyleSheet.create({
 export default class MessageList extends React.PureComponent {
  autoScrollToBottom = false;

+  constructor(props) {
+    super();
+    this.state = { actionSheetButtons: ['', ''] };


We should use state sparingly.
I don't like the API of this action-sheet component at all. It almost forces us to use state, but it is not a good approach.

Also, note that any state change does a new render. In this case, it is likely not a perf issue, but still annoys me :)

But here only once the state is changed, so no issues there.
Even I don't like the static way of using the actionsheets I saw there is an issue related to this in their library github page as well.

borisyankov · 2017-05-08T11:56:57Z

src/compose/SubmitButton.js

@@ -21,16 +21,17 @@ const styles = StyleSheet.create({
  },
 });

-export default class SendButton extends React.Component {
+export default class SubmitButton extends React.Component {


Do we really want to rename the button?
'submit form' vs 'send message'

Yeah, Send Button suggest's its being only used to send the message, but submit suggest's it's being used to complete a process (send or edit)

borisyankov · 2017-05-08T11:58:03Z

src/compose/ComposeText.js

+
+  handleEdit = async () => {
+    const { auth, editMessage, cancelEditMessage } = this.props;
+    if (editMessage.content.raw_content === this.state.text) {


Just do a return.
I don't think there is a single person that cares for the error.
This is too much of a 'developer' thinking ;)

borisyankov · 2017-05-08T11:59:01Z

src/compose/ComposeText.js

+    try {
+      await patchMessage(auth, this.state.text, editMessage.id);
+    } catch (err) {
+      this.showErrorAlert(err.message, 'Error Occurred');


We need a better error message.
If it is a general error I suggest 'Failed to edit message' or 'Error while updating message'.

borisyankov · 2017-05-08T12:00:07Z

src/compose/ComposeText.js

+         title,
+         message,
+         [{ text: 'OK', onPress: () => {} }],
+         { 'cancelable': true } // eslint-disable-line spellcheck/spell-checker


Add cancelable to the dictionary?

Yeah, almost forgot had modified it earlier!

borisyankov · 2017-05-08T12:00:44Z

Overall, the PR looks quite good. 👍

kunall17 · 2017-05-08T12:41:14Z

Updated the PR

jainkuniya

nice work! 👍 found one issue. If user presses back in between editing message, it shows error on reopening app. Expected:- it should cancel editing.

jainkuniya · 2017-05-13T10:57:46Z

src/compose/ComposeText.js

@@ -71,6 +82,29 @@ class ComposeText extends React.Component {
    });
  }

+  showErrorAlert = (message, title) => {


I think we can extract this from here.
we can create a common alert file (in common) which will be helpful in future.

jainkuniya · 2017-05-13T11:06:47Z

src/compose/ComposeText.js

      autocomplete: false,
      contentHeight: MIN_HEIGHT,
    };
  }

+  componentWillReceiveProps(nextProps) {
+    if (nextProps.editMessage !== this.props.editMessage) {
+      this.setState({


we can pop keyboard here this.textInput.focus();

Indeed. Testing on a real device makes it more obvious.

Thanks for the suggestions @vishwesh3 :) 👍

zulipbot · 2017-05-22T02:04:15Z

Heads up @kunall17, we just merged some commits (latest: d7cfbe5) that conflict with the changes your made in this pull request! You can review this repository's recent commits to see where the conflicts occur. Please rebase your feature branch against the upstream/master branch and resolve your pull request's merge conflicts accordingly.

kunall17 · 2017-06-08T21:11:04Z

Updated, b47c353 adds a new library to prevent the editMessage key to be persisted in the storage hence preventing those bugs, currently I have used a library which people suggested in the redux-persist repo!

zulipbot · 2017-06-15T04:17:54Z

Heads up @kunall17, we just merged some commits (latest: 74b3cb3) that conflict with the changes your made in this pull request! You can review this repository's recent commits to see where the conflicts occur. Please rebase your feature branch against the upstream/master branch and resolve your pull request's merge conflicts accordingly.

kunall17 · 2017-06-30T15:53:26Z

Rebased

zulipbot · 2017-07-04T13:27:06Z

Heads up @kunall17, we just merged some commits that conflict with the changes your made in this pull request! You can review this repository's recent commits to see where the conflicts occur. Please rebase your feature branch against the upstream/master branch and resolve your pull request's merge conflicts accordingly.

zulipbot · 2017-07-04T20:05:14Z

Heads up @kunall17, we just merged some commits that conflict with the changes your made in this pull request! You can review this repository's recent commits to see where the conflicts occur. Please rebase your feature branch against the upstream/master branch and resolve your pull request's merge conflicts accordingly.

borisyankov · 2017-07-04T20:54:25Z

I'll do another round of code reviews, before you do the rebase again 😄

borisyankov · 2017-07-05T08:43:22Z

package.json

@@ -58,6 +58,8 @@
    "redux-action-buffer": "^1.1.0",
    "redux-logger": "^3.0.1",
    "redux-persist": "^4.8.2",
+    "redux-persist-transform-filter": "^0.0.10",
+    "redux-persist-transform-immutable": "^4.1.0",


We do not currently use Immutable.js are you sure we need this?

redux-persist-transform-immutable is redundant will remove it, don't remember how it got here!

borisyankov · 2017-07-05T08:51:15Z

src/api/updateMessage.js

@@ -0,0 +1,15 @@
+import { apiPatch } from './apiFetch';


You can get this file merged in, before the whole PR.

Lets keep this file in this, as it has been reviewed. I'll make the api calls in another PR from next time!

borisyankov · 2017-07-05T09:03:16Z

The main thing about this PR that should be improved is how it handles the state of a message being edited.
We can skip the 'filter-transform' library altogether.
We have two better options:

have a per-component state of a message being edited (this.setState) somewhere in the ComposeBox
have it in the Redux store, but not under chat but under app. The app part, I may rename session is intentionally not being saved and is a temporary state that is not persisted.

borisyankov · 2017-07-05T09:04:42Z

src/common/errorAlert.js

+           title,
+           message,
+           [{ text: 'OK', onPress: () => {} }],
+           { 'cancelable': true }


Why ampersands around cancellable?

I don't think cancellable: true is correct, as an error message should not have a cancel option.

cancelable is for the when the user presses outside the alert box, so if a user presses outside of the alert then it can be dismissed!

borisyankov · 2017-07-05T09:05:15Z

src/common/errorAlert.js

@@ -0,0 +1,10 @@
+import { Alert } from 'react-native';


This can also be merged separately, before the full PR is ready.

kunall17 · 2017-07-05T12:23:16Z

have a per-component state of a message being edited (this.setState) somewhere in the ComposeBox

I didn't used state's for this because we need to have the editMessage object in the store as the Title component need's this and this is a read only object, so no need to throw this into state.

I'll move the objects to app.session reducer and I need to dispose this part of reducer on app close, for that I need redux-persist-transform-filter is there a way to do it without this library?
I got this library suggestion from the redux-persist github issues section.

borisyankov · 2017-07-05T16:42:55Z

I meant to rename the 'app' reducer to a 'session' reducer, not sure if you are confused or that you understood me.
We are have this: blacklist: ['app', 'presence'], in store.js so any property of the app reducer will not be persisted.

kunall17 · 2017-07-05T17:25:47Z

Yeah i know about the blacklist, but in the current implementation I had to throw away an object from a reducer hence I had to use this library, so i'll save the object in the app reducer hence we can avoid this library

kunall17 · 2017-07-07T04:37:06Z

Done

zulipbot · 2017-07-07T08:35:46Z

Heads up @kunall17, we just merged some commits that conflict with the changes your made in this pull request! You can review this repository's recent commits to see where the conflicts occur. Please rebase your feature branch against the upstream/master branch and resolve your pull request's merge conflicts accordingly.

zulipbot · 2017-07-08T19:31:08Z

Heads up @kunall17, we just merged some commits that conflict with the changes your made in this pull request! You can review this repository's recent commits to see where the conflicts occur. Please rebase your feature branch against the upstream/master branch and resolve your pull request's merge conflicts accordingly.

kunall17 · 2017-07-11T07:33:20Z

@borisyankov Rebased!

borisyankov · 2017-07-11T12:54:08Z

Another epic-length PR merged :)

kunall17 force-pushed the patch-1 branch from 9920260 to 1aa8f1d Compare March 6, 2017 13:53

borisyankov reviewed Mar 7, 2017

View reviewed changes

kunall17 force-pushed the patch-1 branch from 1aa8f1d to 05ad0b5 Compare March 13, 2017 14:39

kunall17 force-pushed the patch-1 branch from 05ad0b5 to c25f27a Compare April 7, 2017 09:51

borisyankov mentioned this pull request May 7, 2017

Feature parity with the native Android app #558

Closed

5 tasks

kunall17 force-pushed the patch-1 branch 2 times, most recently from 6f58e81 to 4ad47b0 Compare May 7, 2017 10:12

kunall17 force-pushed the patch-1 branch from 4ad47b0 to 9f5976c Compare May 8, 2017 03:01

borisyankov suggested changes May 8, 2017

View reviewed changes

kunall17 force-pushed the patch-1 branch from 9f5976c to a1612ef Compare May 8, 2017 12:40

jainkuniya reviewed May 13, 2017

View reviewed changes

kunall17 force-pushed the patch-1 branch 2 times, most recently from fdd9358 to b47c353 Compare June 8, 2017 21:08

kunall17 force-pushed the patch-1 branch 2 times, most recently from f88c5e0 to af5a8ed Compare June 9, 2017 23:32

kunall17 force-pushed the patch-1 branch 3 times, most recently from 2a7a922 to 318b8f7 Compare July 3, 2017 00:04

kunall17 force-pushed the patch-1 branch from 318b8f7 to 4b7eb63 Compare July 4, 2017 16:17

borisyankov reviewed Jul 5, 2017

View reviewed changes

kunall17 force-pushed the patch-1 branch 2 times, most recently from 7360308 to ebb247b Compare July 6, 2017 19:01

kunall17 force-pushed the patch-1 branch from ebb247b to caa4d94 Compare July 7, 2017 18:40

kunall17 added 2 commits July 11, 2017 11:31

Add edit message to onLongPress

94cb106

Fix flow errors

d96c02d

kunall17 force-pushed the patch-1 branch from caa4d94 to 753d953 Compare July 11, 2017 06:03

Add unit tests

5460c98

kunall17 force-pushed the patch-1 branch from 753d953 to 5460c98 Compare July 11, 2017 06:13

borisyankov merged commit 5c31a46 into zulip:master Jul 11, 2017

borisyankov removed this from Missing functionality in Android Public Release Jul 12, 2017

Implemented editing message #402

Implemented editing message #402

Conversation

kunall17 commented Mar 5, 2017 • edited Loading

smarx commented Mar 5, 2017

Choose a reason for hiding this comment

borisyankov commented Mar 7, 2017

kunall17 commented Mar 7, 2017

kunall17 commented Mar 13, 2017

coveralls commented Apr 7, 2017

zulipbot commented May 5, 2017

kunall17 commented May 7, 2017

borisyankov commented May 8, 2017

borisyankov commented May 8, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

borisyankov commented May 8, 2017

kunall17 commented May 8, 2017

jainkuniya left a comment

Choose a reason for hiding this comment

jainkuniya May 13, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

zulipbot commented May 22, 2017

kunall17 commented Jun 8, 2017

zulipbot commented Jun 15, 2017

kunall17 commented Jun 30, 2017

zulipbot commented Jul 4, 2017

zulipbot commented Jul 4, 2017

borisyankov commented Jul 4, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

borisyankov commented Jul 5, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kunall17 commented Jul 5, 2017

borisyankov commented Jul 5, 2017

kunall17 commented Jul 5, 2017

kunall17 commented Jul 7, 2017

zulipbot commented Jul 7, 2017

zulipbot commented Jul 8, 2017

kunall17 commented Jul 11, 2017

borisyankov commented Jul 11, 2017

kunall17 commented Mar 5, 2017 •

edited

Loading

jainkuniya May 13, 2017 •

edited

Loading