rashgaroth

React dynamic table test

Write us a code to create your dynamic table written in react JS. Your code should be following these rules

• props should be defined by proptypes
• clean code
• native component in react JSX (should not using library)
• data fetching use this api

Motivation

This component will be used for developers who wants to map their delivered data in array, and doesn't want to create their header, body, and footer inside a HTML table with their stuff, so the developers just write a code like

rashgaroth

import React from 'react'
import { getSiteWorkspace, getWorkspacePaths } from '@/prisma/services/workspace'
import { useRouter } from 'next/router'
import AdminLayout from '@/layouts/AdminLayout'
import { Chip, IconButton, Stack } from '@mui/material'
import TableWrapper from '@/components/TableWrapper'
import { Delete, Edit } from '@mui/icons-material'
import { useDispatch } from 'react-redux'
import { setMessageModal } from '@/redux/reducers/global/actions'
import { Mahasiswa } from 'src/svg/Admin'

rashgaroth

const options = {
  weekday: 'short',
  year: 'numeric',
  month: '2-digit',
  day: 'numeric'
}

const getTotalDaysInMonth = (year, month = new Date().getMonth()) => {
  const _mnth = new Date(year, month, 0).getMonth() + 1
  const monthNumberArray = [_mnth - 1, _mnth, _mnth === 12 ? 1 : _mnth + 1]

rashgaroth

// =============================================
// Dwiyan Putra (nefti.dwiyan@gmail.com)
// Jan 11 2022
// =============================================

import * as _aP from 'storage/profile/actions' //your actions (redux)
import * as _aW from 'storage/wallet/walletActions' //your actions (redux)

import React, { useCallback, useEffect, useMemo, useReducer, useState } from 'react'
import { useDispatch, useSelector } from 'react-redux' // im using redux for state management