Add relevant documentation for coding standard to be followed in the project.

For the time period, our service is not ready to launch, we would create a work-in-progress page.

What would it contain?

• Notice for work-in-progress
• About the project
• Invitation for people to contribute

The design should be responsive.

I have created designs for the above pages

^ Desktop Version

Here is the link to the Figma FIle: https://www.figma.com/file/ZokvwLKeLxgqGnidqQ2NAW/Work-in-Progress-Opendesk

#78 Defect
This is to highlight the problems with Work-in-progress Screen Development.

This page is active rn, you can see it at bookopendesk.com

Figma File

(Contains both design and criticism)

FIGMA FILE

(contains design)

ACCOUNT SCREEN

Desktop Version:

Mobile Version:

SEARCH SCREEN

Desktop Version:

Mobile Version:

FIGMA FILE (contains the design)

DESKTOP VERSION

MOBILE VERSION

for the logo use SVG instead of png

Storage created above will be used to store desk setup file while setting up a site.

What we need?

• Project Structure diagram.
• Separation of concern for for various code layer is crucial to maintain project in future.
• Don’t overthink the application structure and avoid using too many nested files and folders
• Divide logical components like, datastore, react components, events and dom.
• Each component should be testable.
• Structure to include where test case will be added.

Below article for inspiration https://www.simform.com/react-architecture-best-practices/

Requirement:

This API in employee service that takes employee id as parameter is used to fetch all the booking details associated to the id.

API:

CODE_BASE: code_base/microservices/employee-service
API: /employee/{empId}/bookings
Method Type: GET

Note: You might need to create data in micro-service via swagger api. Use below url
http://localhost:{port}/swagger-ui.html

Requirement:

UI will call below service when user select a site,floor and date for booking. At present this API exist but just save whatever request comes.

Update API:

CODE_BASE: code_base/microservices/booking-service
API: /booking
Method Type: POST

API will call desk-service GET: /desk/{orgId}/{siteId}/{floorId} this will return all desk that is for the organisation List.

Create a method in BookingService that will take BookingRequest from UI along with list of all desk from desk service.
Lookup booking service db for requested booking date. Check for all desk if booking not available for particular date then return any one desk.

Note: You might need to create data in micro-service via swagger api. Use below url
http://localhost:{port}/swagger-ui.html

This should include high level architect and deployment strategy on AWS. Key features to include.

• Cloudfront for CDN
• Cognito for authentication.
• S3 for hosting static content.
• ECS for image repository
• EKS for container orchestration.

Working on

will be glad to get directives on this

@kanwalnainsingh Assigned to @chimeziesolomon

As a part of this story, UI of Organization onboarding will be done.

refactoring json as string literal to a better way maybe a .json file in Test cases.
Eg - expectedResponse String literal needs refactoring in OrganisationControllerTest.java

There are some minor inconsistencies with development and design. This issue is to highlight those.

Menu Screen

Search Screen

As you can see the search screen doesn't really match with the design of the desktop version.

What need to be done?

Create a microservice project named organisation-service using Spring Boot 2.3.4 and OpenJDK 15.

Endpoints:

/organisation API that will perform respective CRUD operation. Use appropriate below conventions.

For JSON contract refer wireframe, don't add additional not part of current scope of requirement.
https://github.com/kanwalnainsingh/OpenDesk/blob/main/docs/planning/images/organization_onboarding_wireframe_v1.jpg
Conventions to follow:
https://stackoverflow.blog/2020/03/02/best-practices-for-rest-api-design/

Requirement

New API

Microservice: desk-service
Code_Base: https://github.com/kanwalnainsingh/OpenDesk/tree/main/code_base/micro-services/desk-service
Method Type: GET
Path: /desk/{orgId}/{siteId}/{floorId}

What will API do?

API will fetch list of all the desk for particular organisation, site and floor.

Acceptance criteria.

1. Given {orgId} {siteId} {floorId} has corresponding data API should return List for requested data with HTTP Status 200.
2. Given {orgId} {siteId} {floorId} does not have corresponding data API should return empty List with HTTP Status 204 No Content.
3. Given any of {orgId} {siteId} {floorId} is missing API should return empty List with HTTP Status 204 No Content.

Note: Create relevant data to test using swagger api at http://localhost:{port}/swagger-ui.html

https://www.figma.com/proto/AYjVNh02Mhsi5j0P7VhTDv/bookopendesk?node-id=206%3A2729&scaling=min-zoom

• Install rabbitmq locally.
• Sender in organisation service. after site is saved send site save request that came from ui to rabbit mq queue.
  sample to refer.
  https://www.rabbitmq.com/tutorials/tutorial-three-spring-amqp.html

The Designs are ready for both screens. Both the mobile version and Desktop version designs are attached as the screens should be responsive.

FIGMA FILE

MENU SCREENS

MOBILE VERSION >

DESKTOP VERSION>
This screen will work as an overlay to the home screen

SEARCH SCREENS

MOBILE VERSION >

DESKTOP VERSION >

• Design the layout for the UI/UX for organisation screen.
• Layout should include a header
• Refer Wireframe under in planning docs read me.MD

The Design is ready and available in both mobile and desktop versions so that screens are responsive.

FIGMA FILE

DESKTOP VERSION

MOBILE VERSION

The designs are ready and contain both desktop and mobile versions as all screens should be responsive.
Please try to use SVGs instead of PNGs wherever needed.

FIgma File

DESKTOP VERSION >

MOBILE VERSION >

[Figma File]

https://www.figma.com/file/s9ZDbblJ9wnfisoOZI7kTj/bookopendesk?node-id=683%3A548
The designs are ready and contain both desktop and mobile versions as all screens should be responsive.

This issue is for the development of following screens:

• Booking Screen
• Menu

[Figma File] UX design for images style details.

https://www.figma.com/file/s9ZDbblJ9wnfisoOZI7kTj/bookopendesk?node-id=683%3A548

Here is the preview for the home screen:(for the rest of the design please check out the figma file)

MOBILE VERSION

[Figma File]

https://www.figma.com/file/s9ZDbblJ9wnfisoOZI7kTj/bookopendesk?node-id=683%3A548

Requirement

Update is required in existing API as per new design. Remove data fields that are not part of below contract.

Existing API

Method Type: POST
URL: organisation-service/organisation
Request Body:

{
  "orgId": "string",
  "companyName": "string",
  "location": {
    "address": "string",
    "geoLocation": "string"
  },
  "sites": [
    {
      "name": "string",
      "floors": [
        {
          "name": "string",
          "openDesk": "string",
          
        }
      ]
    }
  ]
}

NEW API:

/api/desk-service/availability
POST

requestBody:
{
"orgId": "string"
"floorId":"string"
"requestDate": "string" dd/MM/yyyy

}

Action: api will call booking-service- get all the booking for particular data on orgId and floorId. API will return a desk which is not already booked in booking service.

Describe the bug
Swagger URL not working after deployment on K8s

https://opendesk-kanwalnainsingh.cloud.okteto.net/api/desk-service/swagger-ui.html

This issue is reproducible for all micro-services.

Works fine on dev env.

http://localhost:8082/api/desk-service/swagger-ui.html

This Issue is to develop the designs for the following pages.

- Landing Page

Desktop Verson ^^^

Mobile Version ^^

I HAVE PROVIDED PREVIEW JUST FOR THE LANDING PAGE , for others please check the figma file.

- About Us

- Menu

- How it works (5 steps)

- Contact Us (Design for desktop is not final until further Update)

- Organization Selection screen

All pages will be responsive thus I have designed two versions of each page; for both desktop and mobile.

Figma Design File

(If you are a designer and would like to improve anything, please ping me so as to gain editing access)

Mobile Prototype

Desktop Prototype

The designs are prepared and available in the FIGMA FILE

DESKTOP VERSION

MOBILE VERSION

Project structure with React JS, this should include package manager using npm and test case framework like Jest.
Add appropriate structure for CSS as well.
This should include code package structure.
Refer below link for inspiration https://www.simform.com/react-architecture-best-practices/?fbclid=IwAR3p77RG6h7kUHqcuTwnR8QUDp0fSdvKKLAeXjb-s9SCcyT_jcudLfv8dhA

FIGMA FILE

(Contains Design)

DESKTOP VERSION

MOBILE VERSION

• Build project using Docker.
• Run Application.
• Use alpine Java to run spring boot application.

• Add test case for Embedded Redis to validate test case.

CI/CD Pipeline should included below steps.

• Download fresh dependencies each time build execute.
• Unit test case execution.

Requirement:

With every pull request raised, CI should run that will build the front end project, execute test suite.

Acceptance Criteria

• Give all the case cases pass with the new changes build should pass and move to next step.
• Given there are no error at the build step build should pass and create deployable artifact.

Use a nosql database that can work with spring boot easy to maintain. Make a hello service to save request to db.

Requirement:

This API in booking service that takes employee id as parameter is used to fetch all the booking details associated to the id.

API:

CODE_BASE: code_base/microservices/booking-service
API: /booking/employee/{empId}
Method Type: GET

Note: You might need to create data in micro-service via swagger api. Use below url
http://localhost:{port}/api/bookings-service/swagger-ui.html

FIGMA FILE

(containing the design)

DESKTOP VERSION

MOBILE VERSION