-
Notifications
You must be signed in to change notification settings - Fork 14
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.
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
DMAPP-149: Integrate channel categories #151
Conversation
- Completed UI integration - Completed API integration - Work in progress: Handling search and category filter functionality
- Implemented handling of search and category filters. - Ensured reset of the previous filter when a new one is applied.
- Disabled onPress event for the active category. - Added a new message to display when data is unavailable.
In the file src/Globals.ts:
In the file src/components/pill/Pill.tsx:
In the file src/components/pill/Pill.types.ts:
In the file src/env.config.js:
Please correct these issues and recheck the code. All looks good. |
In the
SOCKETS: {
USE_SOCKETS: true,
STORAGE: {
// Key-value pairs for storage
},
},
ADJUSTMENTS: {
SCREEN_GAP_HORIZONTAL: 10,
SCREEN_GAP_VERTICAL: 10,
DEFAULT_BIG_RADIUS: 10,
DEFAULT_MID_RADIUS: 8,
FEED_ITEM_RADIUS: 8,
COLORS: {
// Colors definitions
},
},
activeView: {
backgroundColor: Globals.COLORS.BLACK,
},
inactiveView: {
backgroundColor: Globals.COLORS.PILL_BG_DEFAULT,
},
export type PillData = {
label: string;
};
WC_RPC: IS_PROD_ENV ? 'prod' : 'staging',
After fixing the above issues, if there are no other mistakes, the code changes should be reviewed thoroughly, and if everything looks good from the logical standpoint, you can consider the code ready for production. Let me know if you need further assistance or clarification. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@meKushdeepSingh please add a video with all the detailed steps on the PR.
src/components/pill/Pill.tsx
Outdated
import {PillProps} from '.'; | ||
|
||
const Pill: FC<PillProps> = ({data, value, onChange, disabled}) => { | ||
const isActive = useMemo(() => data.value === value, [value]); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
useMemo is not required.
@@ -91,6 +98,15 @@ const ChannelsDisplayer = () => { | |||
} catch (e) {} | |||
}; | |||
|
|||
const handleCategoryChange = (category: string) => { | |||
if (search.length > 0 || showSearchResults) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
if (search.length > 0 || showSearchResults) { | |
if (search.length || showSearchResults) { |
- Minor changes in Pill and channelsDisplayer component
In the file Additionally, in the same file, there is a missing closing parenthesis for the Lastly, in the file Once these corrections are made, the code should be fine. All looks good. |
Integration
Integrated UI:
![Screenshot 2025-01-08 at 1 24 53 PM](https://private-user-images.githubusercontent.com/63536883/401056016-ecbb4f96-1996-41d8-9ebd-283eea9ab398.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzg5Mjc1MTgsIm5iZiI6MTczODkyNzIxOCwicGF0aCI6Ii82MzUzNjg4My80MDEwNTYwMTYtZWNiYjRmOTYtMTk5Ni00MWQ4LTllYmQtMjgzZWVhOWFiMzk4LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMDclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjA3VDExMjAxOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWRhN2RmYzAyZGEzMTZhYzRhOTgxZWEyNGFhZjk0MWU1MDBjM2ZiYmE0Y2NlODA0OGI4Nzc3NmUxMTU3ZmEyY2QmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.Hh5YqdIJ32uEYxJLiYPethx8xVUQ5TUIUXWmm1td3qQ)