DApp-1706 blocks/textarea

[rohitmalhotra1420]

Pull Request Template

Ticket Number

• 1706

Description

• Added TextArea component to blocks

• Added support to use the new semantics in the Text component

• Problem/Feature:

Type of Change

• Bug fix
• New feature
• Code refactor
• Documentation update
• Other (please describe):

Checklist

• Quick PR: Is this a quick PR? Can be approved before finishing a coffee.
  • Quick PR label added
• Not Merge Ready: Is this PR dependent on some other PR/tasks and not ready to be merged right now.
  • DO NOT Merge PR label added

Frontend Guidelines

• Followed frontend guidelines as per the Guidelines Notion Doc

Build & Testing

• No errors in the build terminal
• Engineer has tested the changes on their local environment
• Engineer has tested the changes on deploy preview

Screenshots/Video with Explanation

• Before: Explain the previous behavior

• After: What's changed now

Additional Context

Review & Approvals

• Self-review completed
• Code review by at least one other engineer
• Documentation updates if applicable

Notes

[github-actions]

In the Blocks.types.ts file:

1. There is a syntax error in the import of SeparatorResponsiveCSSProperties, SeparatorResponsiveCSSPropertiesData, and SeparatorResponsivePropValues. The correct syntax should be:

import {
  SeparatorResponsiveCSSProperties,
  SeparatorResponsiveCSSPropertiesData,
  SeparatorResponsivePropValues,
} from './separator';

2. There is a typo in the Breakpoint type. Instead of 'ms', it should be 'sm' (small).
3. In the TransformedHTMLAttributes type definition, there is a typo in the attribute style. It should be 'style' | 'color'.
4. The comment block with TODO: Remove BlocksColors seems unnecessary as it is just a future reminder comment. Consider removing it if it's not serving any immediate purpose.

In the Blocks.utils.ts file:

1. There are syntax errors in the commented sections after each function definition. The comment annotations are not formatted correctly.

In the Text.tsx file:

1. In the styled component definition, the wrap property is missing from the template literal for the CSS property white-space.
2. The CSS properties display and width are not wrapped inside template literals in the respective styles.
3. There is a missing opening backtick in the CSS template literal for numberOfLines.
4. The template literals for wrap and numberOfLines are missing opening and closing backticks.
5. The getTextResponsiveCSS function is imported but not defined in the given code snippets.

All other parts of the code seem fine and consistent.

All looks good.

[github-actions]

PR Preview Action v1.4.7
Preview removed because the pull request was closed.
2024-07-10 08:26 UTC

[github-actions]

In the provided code, I have found a few mistakes and typos that need to be corrected:

1. In Blocks.types.ts file:

• The import for SeparatorResponsiveCSSProperties, SeparatorResponsiveCSSPropertiesData, and SeparatorResponsivePropValues should be inside curly braces {} as they are named imports.
• There is a missing opening curly brace { after the comment Helper function to parse the pixel values from the strings. in the parsePixels function.
• The computePixels function is missing an opening curly brace { after the comment describing its purpose.
• The createBreakpointCSS function is referenced in the getResponsiveCSS function but not defined in the same file.

2. In Blocks.utils.ts file:

• The comment @returns" is missing the closing backtick in the getResponsiveCSSfunction above theoperation`.

3. In Text.tsx file:

• In the StyledText component's styling section, the wrap property setting is missing the opening curly braces {}.
• The numberOfLines CSS setting is missing the wrapping parentheses in the StyledText component.
• The getTextResponsiveCSS function should be imported from './Text.utils' but it is mistakenly imported from the same file './Text.tsx'.

After the necessary corrections are made, please ensure to test the functionality to confirm that there are no logical errors.

All looks good.

[github-actions]

All looks good.

[abhishek-01k]

Rest everything looks good to me

[github-actions]

All looks good.