Browse Source

Remove spread fill to avoid duplicate values on autocomplete

master
cracklesparkle 10 months ago
parent
commit
a1a5c2b3a6
  1. 17
      frontend_reactjs/src/components/ServerHardware.tsx
  2. 17
      frontend_reactjs/src/components/ServerIpsView.tsx
  3. 17
      frontend_reactjs/src/components/ServerStorages.tsx
  4. 13
      frontend_reactjs/src/components/ServersView.tsx
  5. 9
      frontend_reactjs/src/pages/Reports.tsx

17
frontend_reactjs/src/components/ServerHardware.tsx

@ -1,5 +1,5 @@
import { AppBar, Autocomplete, CircularProgress, Dialog, IconButton, TextField, Toolbar } from '@mui/material'
import { Fragment, useEffect, useState } from 'react'
import { Fragment, useState } from 'react'
import { IRegion } from '../interfaces/fuel'
import { useHardwares, useServers } from '../hooks/swrHooks'
import FullFeaturedCrudGrid from './TableEditable'
@ -10,19 +10,12 @@ import ServerData from './ServerData'
export default function ServerHardware() {
const [open, setOpen] = useState(false)
const [options, setOptions] = useState<IRegion[]>([])
const [selectedOption, setSelectedOption] = useState<IRegion | null>(null)
const { servers, isLoading } = useServers()
const [serverDataOpen, setServerDataOpen] = useState(false)
const [currentServerData, setCurrentServerData] = useState<any | null>(null)
useEffect(() => {
if (servers) {
setOptions([...servers])
}
}, [servers])
const handleInputChange = (value: string) => {
return value
}
@ -81,9 +74,9 @@ export default function ServerHardware() {
{serversLoading ?
<CircularProgress />
:
hardwares &&
<FullFeaturedCrudGrid
autoComplete={<Autocomplete
autoComplete={
<Autocomplete
open={open}
onOpen={() => {
setOpen(true)
@ -96,7 +89,7 @@ export default function ServerHardware() {
filterOptions={(x) => x}
isOptionEqualToValue={(option: IRegion, value: IRegion) => option.name === value.name}
getOptionLabel={(option: IRegion) => option.name ? option.name : ""}
options={options}
options={servers || []}
loading={isLoading}
value={selectedOption}
renderInput={(params) => (
@ -117,7 +110,7 @@ export default function ServerHardware() {
onSave={() => {
}}
onDelete={ServerService.removeServer}
initialRows={hardwares}
initialRows={hardwares || []}
columns={hardwareColumns}
actions
onRowClick={(params) => {

17
frontend_reactjs/src/components/ServerIpsView.tsx

@ -1,5 +1,5 @@
import { AppBar, Autocomplete, CircularProgress, Dialog, IconButton, TextField, Toolbar } from '@mui/material'
import { Fragment, useEffect, useState } from 'react'
import { Fragment, useState } from 'react'
import { IRegion } from '../interfaces/fuel'
import { useServerIps, useServers } from '../hooks/swrHooks'
import FullFeaturedCrudGrid from './TableEditable'
@ -10,19 +10,12 @@ import ServerData from './ServerData'
export default function ServerIpsView() {
const [open, setOpen] = useState(false)
const [options, setOptions] = useState<IRegion[]>([])
const [selectedOption, setSelectedOption] = useState<IRegion | null>(null)
const { servers, isLoading } = useServers()
const [serverDataOpen, setServerDataOpen] = useState(false)
const [currentServerData, setCurrentServerData] = useState<any | null>(null)
useEffect(() => {
if (servers) {
setOptions([...servers])
}
}, [servers])
const handleInputChange = (value: string) => {
return value
}
@ -79,9 +72,9 @@ export default function ServerIpsView() {
{serversLoading ?
<CircularProgress />
:
serverIps &&
<FullFeaturedCrudGrid
autoComplete={<Autocomplete
autoComplete={
<Autocomplete
open={open}
onOpen={() => {
setOpen(true)
@ -94,7 +87,7 @@ export default function ServerIpsView() {
filterOptions={(x) => x}
isOptionEqualToValue={(option: IRegion, value: IRegion) => option.name === value.name}
getOptionLabel={(option: IRegion) => option.name ? option.name : ""}
options={options}
options={servers || []}
loading={isLoading}
value={selectedOption}
renderInput={(params) => (
@ -115,7 +108,7 @@ export default function ServerIpsView() {
onSave={() => {
}}
onDelete={ServerService.removeServer}
initialRows={serverIps}
initialRows={serverIps || []}
columns={serverIpsColumns}
actions
onRowClick={(params) => {

17
frontend_reactjs/src/components/ServerStorages.tsx

@ -1,5 +1,5 @@
import { AppBar, Autocomplete, CircularProgress, Dialog, IconButton, TextField, Toolbar } from '@mui/material'
import { Fragment, useEffect, useState } from 'react'
import { Fragment, useState } from 'react'
import { IRegion } from '../interfaces/fuel'
import { useHardwares, useStorages } from '../hooks/swrHooks'
import FullFeaturedCrudGrid from './TableEditable'
@ -10,19 +10,12 @@ import ServerData from './ServerData'
export default function ServerStorage() {
const [open, setOpen] = useState(false)
const [options, setOptions] = useState<IRegion[]>([])
const [selectedOption, setSelectedOption] = useState<IRegion | null>(null)
const { hardwares, isLoading } = useHardwares()
const [serverDataOpen, setServerDataOpen] = useState(false)
const [currentServerData, setCurrentServerData] = useState<any | null>(null)
useEffect(() => {
if (hardwares) {
setOptions([...hardwares])
}
}, [hardwares])
const handleInputChange = (value: string) => {
return value
}
@ -78,9 +71,9 @@ export default function ServerStorage() {
{serversLoading ?
<CircularProgress />
:
storages &&
<FullFeaturedCrudGrid
autoComplete={<Autocomplete
autoComplete={
<Autocomplete
open={open}
onOpen={() => {
setOpen(true)
@ -93,7 +86,7 @@ export default function ServerStorage() {
filterOptions={(x) => x}
isOptionEqualToValue={(option: IRegion, value: IRegion) => option.name === value.name}
getOptionLabel={(option: IRegion) => option.name ? option.name : ""}
options={options}
options={hardwares || []}
loading={isLoading}
value={selectedOption}
renderInput={(params) => (
@ -114,7 +107,7 @@ export default function ServerStorage() {
onSave={() => {
}}
onDelete={ServerService.removeServer}
initialRows={storages}
initialRows={storages || []}
columns={storageColumns}
actions
onRowClick={(params) => {

13
frontend_reactjs/src/components/ServersView.tsx

@ -1,5 +1,5 @@
import { AppBar, Autocomplete, Box, CircularProgress, Dialog, Grid, IconButton, TextField, Toolbar } from '@mui/material'
import { Fragment, useEffect, useState } from 'react'
import { Fragment, useState } from 'react'
import { IRegion } from '../interfaces/fuel'
import { useRegions, useServers, useServersInfo } from '../hooks/swrHooks'
import FullFeaturedCrudGrid from './TableEditable'
@ -14,7 +14,6 @@ import CardInfoChip from './CardInfo/CardInfoChip'
import { useDebounce } from '@uidotdev/usehooks'
export default function ServersView() {
const [options, setOptions] = useState<IRegion[]>([])
const [search, setSearch] = useState<string | null>("")
const debouncedSearch = useDebounce(search, 500)
@ -28,12 +27,6 @@ export default function ServersView() {
const [serverDataOpen, setServerDataOpen] = useState(false)
const [currentServerData, setCurrentServerData] = useState<any | null>(null)
useEffect(() => {
if (regions) {
setOptions([...regions])
}
}, [regions])
const { servers, isLoading: serversLoading } = useServers(selectedOption?.id, 0, 10)
const serversColumns: GridColDef[] = [
@ -58,7 +51,7 @@ export default function ServersView() {
}}
isOptionEqualToValue={(option: IRegion, value: IRegion) => option.name === value.name}
getOptionLabel={(option: IRegion) => option.name ? option.name : ""}
options={options}
options={regions || []}
loading={isLoading}
value={params.value}
renderInput={(params) => (
@ -147,7 +140,7 @@ export default function ServersView() {
onChange={(_, value) => setSelectedOption(value)}
isOptionEqualToValue={(option: IRegion, value: IRegion) => option.id === value.id}
getOptionLabel={(option: IRegion) => option.name ? option.name : ""}
options={options}
options={regions || []}
loading={isLoading}
value={selectedOption}
renderInput={(params) => (

9
frontend_reactjs/src/pages/Reports.tsx

@ -10,7 +10,6 @@ import { mutate } from "swr"
export default function Reports() {
const [download, setDownload] = useState(false)
const [options, setOptions] = useState<ICity[]>([])
const [search, setSearch] = useState<string | null>("")
const debouncedSearch = useDebounce(search, 500)
const [selectedOption, setSelectedOption] = useState<ICity | null>(null)
@ -20,12 +19,6 @@ export default function Reports() {
const { reportExported } = useReportExport(selectedOption?.id, download)
useEffect(() => {
if (cities) {
setOptions([...cities])
}
}, [cities])
const refreshReport = async () => {
mutate(`/info/reports/${selectedOption?.id}?to_export=false`)
}
@ -57,7 +50,7 @@ export default function Reports() {
onChange={(_, value) => setSelectedOption(value)}
isOptionEqualToValue={(option: ICity, value: ICity) => option.id === value.id}
getOptionLabel={(option: ICity) => option.name ? option.name : ""}
options={options}
options={cities || []}
loading={isLoading}
value={selectedOption}
renderInput={(params) => (

Loading…
Cancel
Save