(feat): Add helper components

[sudhanshutech]

Notes for Reviewers

Helper Component: Window Dimensions Hook

Description

This pull request introduces a new helper component, useWindowDimensions, as part of our ongoing effort to enhance code reusability. This custom React hook allows us to efficiently track changes in window dimensions, providing a straightforward way to access the current window's width and height in real-time.

Changes Made

• Added the useWindowDimensions hook in a new file, windowSize.tsx, and documented its usage.
• Included a usage example in the README file to showcase the helper's functionality.
• Created a foundation for adding more such helper components in the future to streamline development.

How to Use

1. Import the useWindowDimensions hook from dimension.ts into your React component.
2. Leverage the hook to access the current window's dimensions.
3. Seamlessly respond to window size changes in your application.

Note

This component is needed specially to declare data-tables structure for responsive columns or we can use across any custom components to ensure there responsiveness.
Further adding any such helper components will be documented under readme.md

Signed commits

• Yes, I signed my commits.

[nebula-aac]

Thanks for providing a README.md on this.

However I am a bit confused, is this hook expected to be used in Meshery and Meshery Cloud? Or just for internal use in the components package.

[sudhanshutech]

This hook basically will focus initially on internal use for our custom components but we can also export this

[nebula-aac]

Okay, I made a note to add this to the hooks library once I have this merged in. For now, looks good to me.