Skip to content

Responsive attach file icon#1774

Merged
anjulgarg merged 10 commits intomainfrom
anjulgarg/2813271/responsive-attach-file-icon
Apr 8, 2022
Merged

Responsive attach file icon#1774
anjulgarg merged 10 commits intomainfrom
anjulgarg/2813271/responsive-attach-file-icon

Conversation

@anjulgarg
Copy link
Copy Markdown
Member

What

  • Introducing a formFactor prop to chat composite similar to call composite
  • Attach file icon position changes basis on the form factor

Why

To ensure that composite matches figma designs
image

How Tested

Process & policy checklist

  • I have updated the project documentation to reflect my changes if necessary.
  • I have read the CONTRIBUTING documentation.

Is this a breaking change?

  • This change causes current functionality to break.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Comment thread packages/react-composites/src/composites/ChatComposite/ChatScreen.tsx Outdated
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Comment thread packages/react-composites/src/composites/ChatComposite/ChatScreen.tsx Outdated
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the composite UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

</Stack>
)}
<div style={{ width: '100%' }}>
<SendBox
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are we bringing any of these features to the sendbox component we export?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not 100% sure about the best way to do it.
Since the placement of file attach icon is so different for mobile and desktop.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah not sure either, but can always make this decision when we support rich text as that's when many more changes will be made cc @PorterNan

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right. That's why I am keeping it simple for now.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the composite UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the composite UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

Failed to pass the composite UI Test. If this PR is for UI change and the error is snapshot mismatch, please add "ui change" label to the PR for updating the snapshot.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 7, 2022

* @remarks `mobile` is currently only optimized for Portrait mode on mobile devices and does not support landscape.
* @defaultValue 'desktop'
*/
formFactor?: 'desktop' | 'mobile';
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

when this goes stable we'll have to somehow remember to update storybook docs...

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have made a note.

@anjulgarg anjulgarg enabled auto-merge (squash) April 8, 2022 17:02
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Apr 8, 2022

@anjulgarg anjulgarg merged commit d888514 into main Apr 8, 2022
@anjulgarg anjulgarg deleted the anjulgarg/2813271/responsive-attach-file-icon branch April 8, 2022 17:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants