uwasystemhealth / IndEAA

A web application that streamlines course review by industry advisory panels
https://indeaa.systemhealthlab.com
2 stars 0 forks source link

Coding Standard #42

Open frinzekt opened 3 years ago

frinzekt commented 3 years ago

Import Order

it is important to have an order of import for code readability

I propose the order with alphabetical order enforced:

Frontend

  1. React + Redux + Functionality Imports
  2. Own Components Import
  3. Utilities Import
  4. Material Kit import
  5. Material Ui Import
  6. Icons
  7. Styles Import (both Material UI usestyles, style imports and style definition)

Eg.

// This is reordered of administrator/index.js

import { useEffect, useState } from "react"
import { useDispatch, useSelector } from "react-redux"
import { services } from "store/feathersClient"

// Own Components
import UserModal from "components/administrator/UserModal"
import CreateUserModal from "components/administrator/CreateUserModal"

// Helper
import { getAvailablePermissionsOfUser, roleIcons } from "utils"

// Material Kit
import Card from "components/MaterialKit/Card/Card.js";
import CardBody from "components/MaterialKit/Card/CardBody.js";
import CardHeader from "components/MaterialKit/Card/CardHeader.js";
import Button from "components/MaterialKit/CustomButtons/Button.js";
import Grid from "components/MaterialKit/Grid/GridContainer.js";
import GridItem from "components/MaterialKit/Grid/GridItem.js";

// Material UI
import Tooltip from "@material-ui/core/Tooltip";

// Icons
import Placeholder from "@material-ui/icons/Mood";

//Styles
import { makeStyles } from "@material-ui/core/styles";
import styles from "assets/jss/nextjs-material-kit/pages/landingPage";
const useStyles = makeStyles(styles);

Backend ?? (not yet sure):

  1. Npm Imports
  2. Project imports

Note: Each number list will be separated by a space on import

frinzekt commented 3 years ago

This does not need to be strictly enforced for now, because we are in a rush, however keep this thing in mind

frinzekt commented 3 years ago

For maintainability I have to do a code review from develop to master merge

frinzekt commented 3 years ago

Are you aware of this @MouseAndKeyboard ?

frinzekt commented 3 years ago

For now, no action will be taken except being aware that this exist.

In stage 2, we have to go through all the files and reorder this

frinzekt commented 3 years ago

I think one thing that this also needs are the ground rules that we set

MouseAndKeyboard commented 3 years ago

Only seen this now. Will keep in mind for future.

frinzekt commented 3 years ago

@MouseAndKeyboard see changes

frinzekt commented 3 years ago

I think there is something more with this issue aside from the imports... also the name of the component... I remember I had a bad practice to copy paste certain things from one components to another that I forgot to rename the function (didn't really matter as much in terms of functionality because of export default ... but it should be something that we should address)