Change padding, margins, and borders to allow you to click on the left
margin of to, cc, bcc, from, subject fields as well as the composer
margins both above, left, and to the right of the composer.
Ensured attachments and other assets show up in correct spots
Ensure subject looks correct for mail merge
Summary: Initial support for inline images. Tests still forthcoming!
Test Plan: WIP
Reviewers: mark, juan
Reviewed By: juan
Differential Revision: https://phab.nylas.com/D3295
Summary:
See edgehill revision: https://phab.nylas.com/D3160
- CustomContenteditableComponents.get now takes a single component to register as an overlaid component, and this component will be passed a prop `{isPreview: true}` when it is meant to be rendered as a preview. Update scheduler and mail-merge to use this new api.
- This prevents the mail merge state from being incorrectly updated when we toggled preview mode -- previously, it believed that the tokens had been unmounted when toggling preview, so they were incorrectly removed from the mail merge state.
- Additionally, makes sure that tokens are correctly added to the mail merge state whenever a token is rendered via componentDidMount -- previously, we only added the token to state when a token was dropped on the contenteditable, however, a token might be pasted or an anchor node might be added by any other means, in which case we want the mail merge state to reflect that. (Adds docs about this)
Test Plan: Manual
Reviewers: jackie, evan
Reviewed By: jackie, evan
Differential Revision: https://phab.nylas.com/D3161
Summary:
- Fixes several selection and focus issues along the way
- Can now preview what tokens will look like when not editing
- Adds decorator to listen to mail merge session changes and removes a bunch of duplicated code
- Gets rid of all imperative code (and specs) that had to imperatively
reach into the dom to update the tokens
Test Plan: - Unit tests
Reviewers: bengotow, evan
Reviewed By: evan
Differential Revision: https://phab.nylas.com/D2989
Summary:
SEE ASSOCIATED SUBMODULE DIFF
This enables rich React components (like the Scheduler's `NewEventCard`)
to be used in contenteditables.
We introduce the concept of an "Overlaid Component". These are rendered
React components that are absolutely positioned on top of an equivalent
"Anchor" in a contenteditable.
Inside the contenteditable are special `<img />` tags that have an
id corresponding to a particular rich overlaid component. This way, even
if those img tags are cut and pasted or moved, they'll have a mapping to a
particular component stored in the `OverlaidComponentStore`. Img tags
are fairly well handled natively by contenteditable and allow you to
maniuplate these overlaid components as normal text elements.
The `OverlaidComponentStore` is responsible for listening to and managing
the state of the Anchors and their equivalent OverlaidComponents.
We use a decorator called `ListenToChanges` that allows us to wrap
components to update their corresponding anchor. Since we need to know
about ALL changes that could affect rendered height and width, we need to
use a `MuatationListener` instead of the React render cycle.
This is only the initial diff. There are several TODOs here:
https://paper.dropbox.com/doc/Composer-Overlaid-Components-FoZrF0cFggzSUZirZ9MNo
Test Plan: TODO. Manual
Reviewers: juan, bengotow
Reviewed By: juan
Differential Revision: https://phab.nylas.com/D2946
Summary:
Adds ability to drop tokens in subject via a custom rendered subject field which
renders a contenteditable instead of an input.
Decided to completely replace the subject field via injected components for a
few resons:
- That's the way we are currently extending the functionality of the participant fields, so it keeps the plugin code consistent (at the cost of potentially more code)
- Completely replacing the subject for a contenteditable means we hace to do extra work to clean up the html before sending.
- Reusing our Contenteditable.cjsx class for the subject is overkill, but using a vanilla contenteditable meant duplicating a bunch of the code in that class if we want to add
Test Plan: Unit tests
Reviewers: bengotow, evan
Reviewed By: evan
Differential Revision: https://phab.nylas.com/D2949
Summary:
- Removes controlled focus in the composer!
- No React components ever perfom focus in lifecycle methods. Never again.
- A new `Utils.schedule({action, after, timeout})` helper makes it easy to say "setState or load draft, etc. and then focus"
- The DraftStore issues a focusDraft action after creating a draft, which causes the MessageList to focus and scroll to the desired composer, which itself decides which field to focus.
- The MessageList never focuses anything automatically.
- Refactors ComposerView apart — ComposerHeader handles all top fields, DraftSessionContainer handles draft session initialization and exposes props to ComposerView
- ComposerHeader now uses a KeyCommandRegion (with focusIn and focusOut) to do the expanding and collapsing of the participants fields. May rename that container very soon.
- Removes all CommandRegistry handling of tab and shift-tab. Unless you preventDefault, the browser does it's thing.
- Removes all tabIndexes greater than 1. This is an anti-pattern—assigning everything a tabIndex of 0 tells the browser to move between them based on their order in the DOM, and is almost always what you want.
- Adds "TabGroupRegion" which allows you to create a tab/shift-tabbing group, (so tabbing does not leave the active composer). Can't believe this isn't a browser feature.
Todos:
- Occasionally, clicking out of the composer contenteditable requires two clicks. This is because atomicEdit is restoring selection within the contenteditable and breaking blur.
- Because the ComposerView does not render until it has a draft, we're back to it being white in popout composers for a brief moment. We will fix this another way - all the "return unless draft" statements were untenable.
- Clicking a row in the thread list no longer shifts focus to the message list and focuses the last draft. This will be restored soon.
Test Plan: Broken
Reviewers: juan, evan
Reviewed By: juan, evan
Differential Revision: https://phab.nylas.com/D2814
Summary:
WIP
Remove the mode prop from everywhere, use NylasEnv.isComposerWindow() instead
Test Plan: Run updated tests
Reviewers: drew, evan
Reviewed By: evan
Differential Revision: https://phab.nylas.com/D2766
Summary:
Adds the new Account preferences page. This consists of two major React components,
PreferencesAccountList and PreferencesAccountDetails, both of which use EditableList.
I added a bunch of fixes and updated the API for EditableList, plus a bit of
refactoring for PreferencesAccount component, and a bunch of CSS so its a big diff.
The detailed changelog:
Updates to EditableList:
- Fix bug updating selection state when arrows pressed to move selection
- Add new props:
- allowEmptySelection to allow the list to have no selection
- createInputProps to pass aditional props to the createInput
- Add scroll region for list items
- Update styles and refactor render methods
Other Updates:
- Updates Account model to hold aliases and a label
- Adds getter for label to default to email
- Update accountswitcher to display label, update styles and spec
- Refactor PreferencesAccounts component:
- Splits it into smaller components,
- Removes unused code
- Splits preferences styelsheets into smaller separate stylesheet for
account page. Adds some updates and fixes (scroll-region padding)
- Update AccountStore to be able to perform updates on an account.
- Adds new Action to update account, and an action to remove account to
be consistent with Action usage
- Adds components for Account list and Aliases list using EditableList
Test Plan: - All specs pass, but need to write new tests!
Reviewers: bengotow, evan
Reviewed By: bengotow
Differential Revision: https://phab.nylas.com/D2332
Summary:
Related to #320, #494, #515, #553
Ignore newlines and returns in HTML, they can be inside tags
Allow all attributes so that paste from excel looks nice
Never let someone paste a `contenteditable` attribute
Update specs
Test Plan: Run new specs
Reviewers: juan, evan
Reviewed By: evan
Differential Revision: https://phab.nylas.com/D2309
Summary:
Add signatures back in.
Extract contenteditable css to its own file instead of being bundled with
the composer.
Test Plan: manual
Reviewers: juan, bengotow
Reviewed By: bengotow
Differential Revision: https://phab.nylas.com/D2295
Summary:
Participants now collapse Gmail style in the composer field.
New, more declarative system for how we deal with "focusedFields" on the
composer.
Extracted a `CollapsedParticipants` and `ExpandedParticipants` component.
Test Plan: TODO
Reviewers: dillon, bengotow
Reviewed By: bengotow
Differential Revision: https://phab.nylas.com/D2013
Summary: New draft store extension that highlights misspelled words.
Test Plan: No test coverage yet
Reviewers: evan, dillon
Reviewed By: evan
Differential Revision: https://phab.nylas.com/D1972
