Admin UI - Manage Registry

[arajput]

A generic UI design to manage any registry records like teachers, students etc.

Features

1. A List View of registry with search, filter
2. Add/Update Form for registry record
3. CSV import

Figma Designs -
https://www.figma.com/file/9qQOSdSSk60ZIakSJyNavb/Admin-Console-(Dev-File)?node-id=170%3A605

Define Schema for registry which is used to render List view and form
Generic Backend API to Search/Add/Edit/Delete registry records

[coolbung]

@Shruti3004 can you help align the registry section in Shiksha Admin with the X-Admin effort that is being undertaken. The requirements seem to be quite similar (i.e. managing records)

cc @rahul101001000 @sukhpreetsamagra @sagarihanda

[arajput]

References -
https://tanstack.com/table/v8/docs/adapters/react-table
https://github.com/marmelab/react-admin
https://github.com/Samagra-Development/x-admin

react admin uses MUI lib.
Samagra's x-admin is nextjs app and it uses react-admin (MUI components).
It has config.js for menu sidebar which imports List, Show, Create, Edit components.
Data Provider is hasura graphql implementaion
Authentication is fusion auth

Proposed Approach -

Instead of using x-admin directly, use react-admin within react-app

• Use react-admin to develop admin console app shell copy code from x-admin
• We can use module federation as it is react app
• Implement react-admin's Data Provider for REST API
• Enhance menu component to use json file for list of menu and submenu (only two levels)
• Generic List Component to handle any type of registry list page
• Generic Add/Edit form using react-admin form components (?) Alternate use react-json-schema-form to devlope add/edit form

We also need to check if config ui (chakra theme) can be used along with react-admin theme. if not them we need to modify the templates used for config ui to use material theme MUI components