function ServicesPanel()

in dialogflow-cx/vpc-sc-demo/frontend/src/AssetPollToggle.js [962:1053]
92 lines of code
1 McCabe index (conditional complexity)

function ServicesPanel(props) {
  const project_id = props.dataModel.projectData.project_id.current;
  return (
    <>
      <Grid container direction="row" justifyContent="space-between">
        <Typography variant="h6">APIs & Services:</Typography>
        <QueryToggleAsset
          target="module.services"
          dataModel={props.dataModel}
          enableAlert={true}
          includeNameBox={true}
          isModuleSwitch={true}
        />
      </Grid>
      <Divider sx={{my: 1}} orientation="horizontal" flexItem />
      <Grid container justifyContent="flex-end">
        <QueryToggleAsset
          name="dialogflow"
          target="google_project_service.dialogflow"
          dataModel={props.dataModel}
          href={servicesLink('dialogflow', project_id)}
        />
        <QueryToggleAsset
          name="cloudfunctions"
          target="google_project_service.cloudfunctions"
          dataModel={props.dataModel}
          href={servicesLink('cloudfunctions', project_id)}
        />
        <QueryToggleAsset
          name="compute"
          target="google_project_service.compute"
          dataModel={props.dataModel}
          href={servicesLink('compute', project_id)}
        />
        <QueryToggleAsset
          name="iam"
          target="google_project_service.iam"
          dataModel={props.dataModel}
          href={servicesLink('iam', project_id)}
        />
        <QueryToggleAsset
          name="servicedirectory"
          target="google_project_service.servicedirectory"
          dataModel={props.dataModel}
          href={servicesLink('servicedirectory', project_id)}
        />
        <QueryToggleAsset
          name="run"
          target="module.services.google_project_service.run"
          dataModel={props.dataModel}
          href={servicesLink('run', project_id)}
        />
        <QueryToggleAsset
          name="cloudbuild"
          target="google_project_service.cloudbuild"
          dataModel={props.dataModel}
          href={servicesLink('cloudbuild', project_id)}
        />
        <QueryToggleAsset
          name="artifactregistry"
          target="google_project_service.artifactregistry"
          dataModel={props.dataModel}
          href={servicesLink('artifactregistry', project_id)}
        />
        <QueryToggleAsset
          name="accesscontextmanager"
          target="google_project_service.accesscontextmanager"
          dataModel={props.dataModel}
          href={servicesLink('accesscontextmanager', project_id)}
        />
        <QueryToggleAsset
          name="cloudbilling"
          target="google_project_service.cloudbilling"
          dataModel={props.dataModel}
          href={servicesLink('cloudbilling', project_id)}
        />
        <QueryToggleAsset
          name="vpcaccess"
          target="module.services.google_project_service.vpcaccess"
          dataModel={props.dataModel}
          href={servicesLink('vpcaccess', project_id)}
        />
        <QueryToggleAsset
          name="appengine"
          target="module.services.google_project_service.appengine"
          dataModel={props.dataModel}
          href={servicesLink('appengine', project_id)}
        />
      </Grid>
    </>
  );
}