[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