upes-open / lost-and-found-mobile-app Goto Github PK

A Mobile app for the university that will ease the process of retrieving lost items. It is a big problem when you lose valuable items, and in that case, it becomes helpful if you are able to see through a list of items found lately, and luckily, if you do find your item there, then you save a lot of time and sweat. For Hacktoberfest see .md files

Home Page: https://hacktoberfest.com/

JavaScript 100.00%

mobile-app react-native and devops found hacktoberfest2023 lost mern-stack hacktoberfest hacktoberfest-accepted

lost-and-found-mobile-app's Introduction

Lost And Found Mobile App

About the Project

It is noticed that whenever we lose something on campus, we have to run to the Lost and Found department and look for it there, and at times the item reaches there after we have already visited it once. Hence, an app would be helpful to provide information about this. It will be simple and elegantly designed. There will be a login page, and then there will be two options to choose from: find a lost item or report an item that is found and belongs to someone else. Then there will be multiple options to choose from, including basic items such as ID Cards, Mobile Phones, wallets, ATM cards, notebooks, and others. If someone has to report a found item, they can either select identifiable or anonymous, or else they can submit it to the lost and found department and tell the owner to claim it from there. The owner can prove their identity and claim the item. There is a web application already built and can be used for reference purposes- https://osoc-lost-and-found-webapp.netlify.app/

The mobile app will be built using React Native and MongoDB as a database.

To know about the workflow of the project and get an idea how the complete project will look like:

See project workflow

Tech Stack

Contributing

Fork and Star the project.
Clone the repo on your local machine.

git clone https://github.com/upes-open/OSoC-Lost-And-Found-WebApp

Create a new branch <Your_GitHub_username> and switch to it with

git checkout -b <GitHub_usename>

Go to the issues tab and comment on a suitable issue of your choice and wait for the issue to be assigned to you.
Make the changes in your local repo and push the changes.
Create a pull request to the main branch.
Wait for the PR to be reviewed and merged.

Happy Contributing !

lost-and-found-mobile-app's People

Contributors

Stargazers

Watchers

Forkers

thapavinay rishabh-108272 saarthakmaini manav-khandurie thilagavathi1 arshdeepkaur04 rampantvoid vedantsaraf2002 mustafaazad03 vaibhav-rawat03 aishaagarwal

lost-and-found-mobile-app's Issues

Create a basic landing page/ Home Page

This page will be the first page the user will get once they succesfully sign in.

This page will basically point to the other pages which are useful. It will point to- Report Lost Item, Report Found Item, Items Gallery, Help Us Find, Feedback and FAQ

Integrating Cloudinary with MongoDB

Cloudinary is integrated with our source code, but it needs to be integrated with mongodb so that the image urls are accessed from there.

Fix the Routing

The routing of the home page needs to fixed according to the icons provided. Apart from that the "Report as found button" in the help us find page needs to be routed correctly to the "Found Items Details" Page

Refine the drawer menu

The drawer style menu is created but it is not aesthetically pleasing. Transform the content in chronological order and add relatable icons for each item.

Fix the login page

Currently the login page is not working properly. Find the bug and fix it. We are using MSAL for authentication.

Claim Item form integration in the items gallery page

Connect the claim item page from the claim item button present in the items gallery page

Integration with cloudinary

The backend is built using MongoDB. We need to upload images on it but we can't store that much data on MongoDB hence we need to connect it Cloudinary which will store our images.
You may ask for the MongoDB credentials

Items Gallery Page- Claim item form

This form will contain the following details-

All the details will be mandatory.

Update the content of FAQ page

Our FAQ Page is created but doesn't has valid content. Refer to https://osoc-lost-and-found-webapp.netlify.app/ for the FAQ content and update it

Items gallery page- Select Category section

It would be great if we can have the above transition where there will be 4 circles for the main categories and when we click on one then the sub categories will open up in the smaller circles, we will be using animated icons for the categories.

Refer to Workflow for the categories and subcategories.

Create a report found item page

Similar to the lost item page, create a found item page, refer to the webapp for fields and #3 for the design

Create a login Page

A login Page for user with an aethetic appeal. Refer to the designs below for inspiration:-

Make sure you only add the sign in button and some image if you want, refer to the webapp for further clarification.

Profile Page

Create a basic profile page for the user which will have an option of logging out, and will display the number of items reported as lost or found .

Create FAQ Page

For FAQ content, refer to the web app: https://osoc-lost-and-found-webapp.netlify.app/
Sample Ideas for FAQ Page

Create Report Lost Item Page

This page will basically be a form and will be used to fetch user data. Refer to the webapp for the feilds to be included.

Integrate Claim Item form with backend

create a drawer style menu

It will contain- Home, Report found item, report lost item, help us find, items gallery, feedback and faq

Add images to the sub category selection page

Once user selects the main category from the category selection page in the items gallery, then they have to also select the sub category which currently has some default images, replace them with relevant images

Create a help us find page

Instead of scrolling from top to bottm , for the help us find page we shall scroll from left to right and display the items that are lost and should be reported if found.

Integrate Profile page frontend with backend

Fetch user data from backend and integrate it with the frontend

Items Gallery Page- Details about the item

When the user click on see details button from #13 then they will be directed to this page. Here they will know about the details about the item, which are collected from #5
Refer to below image for idea about the design:

Instead of Add to cart there will be a "Claim" button

Fix the login page

Currently the app is not deployed and MSAL is using uncertain address, fix this issue by using relevant authorisation technique

Items Gallery Page- Show items based on category

This page will display items based on the selected category. You may refer to the images below to get an idea of how the page is expeted to look:

In place of circlles in bottom right, there will be a "See Details" button

Light and Dark Modes Switch button with integrated functionality

Add dark and light modes for each page made so far, also make a fucntion for the same which can be called while progressing with other pages as well. The modes switch will be on the drawer style menu (already made). Refer to the images below for switch design.