[C4GT] REFACTORING

[geeky-abhishek]

Project Details

UCI is created with a vision to make the conversation flow creation configurable to a level, that it can be done by program owners, without the intervention of any engineers at all. At the same time, it also envisions reducing the redundant coding required for enabling the same business logic for different channels.

UCI aims to democratize the use of different communication channels such as WhatsApp, Telegram, SMS, email and more across all governance use cases.

UCI is being used to create 2 ways communication channels via chatbots between lakhs of teachers in Uttar Pradesh & the state. These chatbots are configured from an admin panel and trigger notifications to the teachers. Teachers then click on the notifications on their Android phones and talk to the chatbot. This is making day to day communication realtime & very effective between teachers and the state.

UCI-WEB-CHANNEL is a frontend application which uses UCI backend for communication.

Features to be implemented

Refactor Each Page/Component inside the path apps/uci/web/src/components & apps/uci/web/app based on the acceptance criteria of a component/page

Learning Path

Complexity

Medium

Skills Required

Javascript, Typescript, React, NextJS, React testing library, JEST

Name of Mentors:

@geeky-abhishek

Project size

8 Weeks

Product Set Up

Acceptance Criteria

• [ ] Lines of code in a file <= 250

• [ ] Unit Test Cases using Jest for backend and React Testing Library for frontend

• [ ] e2e Test Caes using Playwright

• [ ] All linting rules should be passed

• [ ] Proper Types should be added

• [ ] All strings used should be translated

• [ ] Functions and variables used should be memoized

• [ ] Have separate css file for each page/component

• [ ] Proper naming conventions should be followed

• [ ] Proper test case

• [ ] Should not have inline style

C4GT

This issue is nominated for Code for GovTech (C4GT) 2023 edition. C4GT is India's first annual coding program to create a community that can build and contribute to global Digital Public Goods. If you want to use Open Source GovTech to create impact, then this is the opportunity for you! More about C4GT here: https://codeforgovtech.in/

[RajGM]

Hi @geeky-abhishek What do we mean by Functions and variables used should be memorized?

[RajGM]

@geeky-abhishek `Cannot find module 'chatui' or its corresponding type declarations.

1 | import Chat from 'chatui';`

`Cannot find module 'chatui' or its corresponding type declarations.

1 | import { Bubble, Image, ScrollView, List, ListItem, Avatar, FileCard, Video } from 'chatui';`

The problem persists even after installing chat ui

[RajGM]

[RajGM]

npm run build fails with: chatui:build: 'BABEL_ENV' is not recognized as an internal or external command

[Rishit30G]

Getting these four errors on running it locally

[RajGM]

Hi @Rishit30G Did you face an error while compiling?

[Rishit30G]

During compilation everything was fine, but when I was viewing it on localhost, I got these error messages in console

[geeky-abhishek]

Hey @Rishit30G , can you mention the steps you followed?

[Rishit30G]

cloned the repo then npm i then npm run dev

[Rishit30G]

Any updates ? To me it looks like something to do with NextJs

[geeky-abhishek]

@Rishit30G

Hi @geeky-abhishek What do we mean by Functions and variables used should be memorized?

This means the components should not re-render until it's depend prop is changed

[geeky-abhishek]

@Rishit30G can you plz dm me on discord? My user id is - 1044532981857001502

[geeky-abhishek]

Hey I guess you tried to run the old code base ,try to run the latest one

[SaiRev0]

@geeky-abhishek This project is interesting, and I m looking forward to contributing to this work in the C4GT 2023.

I have over 2 years of experience working with Technologies Like React for the frontend, nodejs, and Express for the backend. I'm a Full Stack Web developer and have worked with MERN stack. I have experience working in the open-source community and have contributed to numerous organisations.

So should I connect with the mentors or submit the proposal?

[Rishit30G]

@Rishit30G can you plz dm me on discord? My user id is - 1044532981857001502

Sure

[shreyaspande2003]

Hello @geeky-abhishek .... I would like to express my strong proficiency in, HTML, CSS, and Node.js , Javascript and React.js. With a solid grasp of these technologies, I am eager to make a meaningful contribution to this project. If possible, I kindly request to be assigned to this endeavor so that I may commence my efforts promptly and begin actively working on it.

also as i joined new .. can anyone please tell me the original github link the project is deployed

[primeTanM]

Hello @geeky-abhishek, I would love to contribute to this project.I am facing a problem while setting up.I have modified the env to NEXT_PUBLIC_TRANSPORT_SOCKET_URL="localhost:3000" so that it points to localhost when I start the server.But I am not seeing anything in localhost.Can you please assist in this