From fbd41812dd9c10ead553d9b7a1440232856b0c42 Mon Sep 17 00:00:00 2001
From: Patrick Fic <>
Date: Mon, 10 May 2021 11:02:52 -0700
Subject: [PATCH] Adjust report center to use radio groups.

---
 .../report-center-modal.component.jsx                  | 10 ++++++----
 .../report-center-modal.container.jsx                  |  1 +
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/client/src/components/report-center-modal/report-center-modal.component.jsx b/client/src/components/report-center-modal/report-center-modal.component.jsx
index c8423abd6..b7bb08703 100644
--- a/client/src/components/report-center-modal/report-center-modal.component.jsx
+++ b/client/src/components/report-center-modal/report-center-modal.component.jsx
@@ -1,5 +1,5 @@
 import { useLazyQuery } from "@apollo/client";
-import { Button, DatePicker, Form, Radio, Select } from "antd";
+import { Button, DatePicker, Form, Radio } from "antd";
 import moment from "moment";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -96,11 +96,13 @@ export function ReportCenterModalComponent({ reportCenterModal }) {
             },
           ]}
         >
-          <Select>
+          <Radio.Group style={{ columns: "3 auto" }}>
             {Object.keys(Templates).map((key) => (
-              <Select.Option key={key}>{Templates[key].title}</Select.Option>
+              <Radio key={key} value={key}>
+                {Templates[key].title}
+              </Radio>
             ))}
-          </Select>
+          </Radio.Group>
         </Form.Item>
         <Form.Item dependencies={["key"]}>
           {() => {
diff --git a/client/src/components/report-center-modal/report-center-modal.container.jsx b/client/src/components/report-center-modal/report-center-modal.container.jsx
index 2a0e800b1..ea8167e7d 100644
--- a/client/src/components/report-center-modal/report-center-modal.container.jsx
+++ b/client/src/components/report-center-modal/report-center-modal.container.jsx
@@ -31,6 +31,7 @@ export function ReportCenterModalContainer({
       onCancel={() => toggleModalVisible()}
       cancelButtonProps={{ style: { display: "none" } }}
       destroyOnClose
+      width="60%"
     >
       <ReportCenterModalComponent />
     </Modal>