Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix for: Triple clicking an edited message select’s the (edited) label along with the actual message Att# 2 #18523

Merged
merged 9 commits into from
May 19, 2023
Merged

Fix for: Triple clicking an edited message select’s the (edited) label along with the actual message Att# 2 #18523

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
8f36a4b
Add dInlineFlex to display
Ollyws May 6, 2023
15b4bf6
Created editedLabelStyles
Ollyws May 6, 2023
16d5cf1
Added styles to edited label
Ollyws May 6, 2023
f5a69c1
Merge branch 'main' into fix2-15194
Ollyws May 11, 2023
3928939
Run prettier
Ollyws May 16, 2023
0ffaa22
Added selectable prop
Ollyws May 16, 2023
fe67d69
Re-run prettier
Ollyws May 16, 2023
e56c452
Moved MiniReportActionContextMenu to top of View
Ollyws May 16, 2023
dd8c5b4
Merge branch 'main' into fix2-15194
Ollyws May 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ import withLocalize, {withLocalizePropTypes} from '../../withLocalize';
import Text from '../../Text';
import variables from '../../../styles/variables';
import themeColors from '../../../styles/themes/default';
import styles from '../../../styles/styles';
import editedLabelStyles from '../../../styles/editedLabelStyles';

const propTypes = {
...htmlRendererPropTypes,
Expand All @@ -19,8 +21,11 @@ const EditedRenderer = (props) => {
{...defaultRendererProps}
fontSize={variables.fontSizeSmall}
color={themeColors.textSupporting}
style={[styles.alignItemsBaseline, editedLabelStyles]}
>
{` ${props.translate('reportActionCompose.edited')}`}
{/* Native devices do not support margin between nested text */}
<Text style={[styles.w1, styles.userSelectNone]}>{' '}</Text>
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
<Text style={[styles.w1, styles.userSelectNone]}>{' '}</Text>
<Text selectable={false} style={[styles.w1, styles.userSelectNone]}>{' '}</Text>

Should there be selectable={false}?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@parasharrajat We didn't have it in the original PR, as far as I'm aware it just adds userSelectNone so is redundant in this case.

Copy link
Member

Choose a reason for hiding this comment

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

But this is the proper way so let's add this as well.

{props.translate('reportActionCompose.edited')}
</Text>
);
};
Expand Down
15 changes: 9 additions & 6 deletions src/pages/home/report/ReportActionItemFragment.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import * as StyleUtils from '../../../styles/StyleUtils';
import {withNetwork} from '../../../components/OnyxProvider';
import CONST from '../../../CONST';
import applyStrikethrough from '../../../components/HTMLEngineProvider/applyStrikethrough';
import editedLabelStyles from '../../../styles/editedLabelStyles';

const propTypes = {
/** The message fragment needing to be displayed */
Expand Down Expand Up @@ -117,12 +118,14 @@ const ReportActionItemFragment = (props) => {
>
{StyleUtils.convertToLTR(Str.htmlDecode(text))}
{Boolean(props.fragment.isEdited) && (
<Text
fontSize={variables.fontSizeSmall}
color={themeColors.textSupporting}
>
{` ${props.translate('reportActionCompose.edited')}`}
</Text>
<Text
fontSize={variables.fontSizeSmall}
color={themeColors.textSupporting}
style={[styles.alignItemsBaseline, editedLabelStyles]}
>
<Text style={[styles.w1, styles.userSelectNone]}>{' '}</Text>
Copy link
Member

Choose a reason for hiding this comment

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

Same here?

{props.translate('reportActionCompose.edited')}
</Text>
)}
</Text>
);
Expand Down
3 changes: 3 additions & 0 deletions src/styles/editedLabelStyles/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import display from '../utilities/display';

export default {...display.dInlineFlex};
1 change: 1 addition & 0 deletions src/styles/editedLabelStyles/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export default {};
5 changes: 5 additions & 0 deletions src/styles/utilities/display.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,11 @@ export default {
dInline: {
display: 'inline',
},

dInlineFlex: {
display: 'inline-flex',
},

dBlock: {
display: 'block',
},
Expand Down