configure readOnly via simple component prop

This eliminates the use of YAML configuration and instead
relies on a simple property to enable `readOnly` mode, per code review feedback.

Signed-off-by: Mike Ball <mikedball@gmail.com>

plugins/splunk-on-call/README.md

@@ -45,6 +45,14 @@ const overviewContent = (
     </EntitySwitch>
 ```
 
+### `readOnly` mode
+
+To suppress the rendering of the actionable create-acknowledge-resolve incident buttons and UI controls, the `EntitySplunkOnCallCard` can also be instantiated in `readOnly` mode:
+
+```ts
+<EntitySplunkOnCallCard readOnly />
+```
+
 ## Client configuration
 
 In order to be able to perform certain actions (create-acknowledge-resolve an action), you need to provide a REST Endpoint.
@@ -74,17 +82,9 @@ proxy:
 
 In addition, to make certain API calls (trigger-resolve-acknowledge an incident) you need to add the `PATCH` method to the backend `cors` methods list: `[GET, POST, PUT, DELETE, PATCH]`.
 
-**WARNING**: In current implementation, the Splunk OnCall plugin requires the `/splunk-on-call` proxy endpoint be exposed by the Backstage backend as an unprotected endpoint, in effect enabling Splunk OnCall API access using the configured `SPLUNK_ON_CALL_API_KEY` for any user or process with access to the `/splunk-on-call` Backstage backend endpoint. See below for further configuration options enabling protection of this endpoint.
-
-### Read Only mode
-
-The Splunk OnCall plugin also supports a "read only" mode if you wish to suppress the rendering of UI controls to trigger-resolve-acknowledge incidents.
+**WARNING**: In current implementation, the Splunk OnCall plugin requires the `/splunk-on-call` proxy endpoint be exposed by the Backstage backend as an unprotected endpoint, in effect enabling Splunk OnCall API access using the configured `SPLUNK_ON_CALL_API_KEY` for any user or process with access to the `/splunk-on-call` Backstage backend endpoint. See below for further configuration options enabling protection of this endpoint. If you regard this as problematic, consider using the plugin in `readOnly` mode (`<EntitySplunkOnCallCard readOnly />`) using the following proxy configuration:
 
 ```yaml
-# enable readOnly mode
-splunkOnCall:
-  readOnly: true
-
 proxy:
   '/splunk-on-call':
     target: https://api.victorops.com/api-public

plugins/splunk-on-call/src/components/EntitySplunkOnCallCard.test.tsx

@@ -53,14 +53,6 @@ const mockSplunkOnCallApi: Partial<SplunkOnCallClient> = {
 const configApi: ConfigApi = new ConfigReader({
   splunkOnCall: {
     eventsRestEndpoint: 'EXAMPLE_REST_ENDPOINT',
-    readOnly: false,
-  },
-});
-
-const readOnlyConfigApi: ConfigApi = new ConfigReader({
-  splunkOnCall: {
-    eventsRestEndpoint: 'EXAMPLE_REST_ENDPOINT',
-    readOnly: true,
   },
 });
 
@@ -70,12 +62,6 @@ const apis = TestApiRegistry.from(
   [alertApiRef, {}],
 );
 
-const readOnlyApis = TestApiRegistry.from(
-  [splunkOnCallApiRef, mockSplunkOnCallApi],
-  [configApiRef, readOnlyConfigApi],
-  [alertApiRef, {}],
-);
-
 const mockEntity = {
   apiVersion: 'backstage.io/v1alpha1',
   kind: 'Component',
@@ -155,9 +141,9 @@ describe('SplunkOnCallCard', () => {
 
     const { getByText, queryByTestId } = render(
       wrapInTestApp(
-        <ApiProvider apis={readOnlyApis}>
+        <ApiProvider apis={apis}>
           <EntityProvider entity={mockEntityNoIncidents}>
-            <EntitySplunkOnCallCard />
+            <EntitySplunkOnCallCard readOnly />
           </EntityProvider>
         </ApiProvider>,
       ),

plugins/splunk-on-call/src/components/EntitySplunkOnCallCard.tsx

@@ -109,7 +109,12 @@ const useStyles = makeStyles({
   },
 });
 
-export const EntitySplunkOnCallCard = () => {
+type Props = {
+  readOnly?: boolean;
+};
+
+export const EntitySplunkOnCallCard = ({ readOnly }: Props) => {
+  const readOnlyMode = readOnly || false;
   const classes = useStyles();
   const config = useApi(configApiRef);
   const api = useApi(splunkOnCallApiRef);
@@ -126,8 +131,6 @@ export const EntitySplunkOnCallCard = () => {
   const eventsRestEndpoint =
     config.getOptionalString('splunkOnCall.eventsRestEndpoint') || true;
 
-  const readOnly = config.getOptionalBoolean('splunkOnCall.readOnly') || false;
-
   const handleRefresh = useCallback(() => {
     setRefreshIncidents(x => !x);
   }, []);
@@ -221,7 +224,7 @@ export const EntitySplunkOnCallCard = () => {
     return (
       <>
         <Incidents
-          readOnly={readOnly}
+          readOnly={readOnlyMode}
           team={teamName}
           refreshIncidents={refreshIncidents}
         />