fix(splunk-on-call-plugin): lint + typos

plugins/splunk-on-call/src/api/client.ts

@@ -38,7 +38,7 @@ export class UnauthorizedError extends Error {}
 
 export const splunkOnCallApiRef = createApiRef<SplunkOnCallApi>({
   id: 'plugin.splunk-on-call.api',
-  description: 'Used to fetch data from SplunkOnCall API',
+  description: 'Used to fetch data from Splunk On-Call API',
 });
 
 export class SplunkOnCallClient implements SplunkOnCallApi {
@@ -190,7 +190,7 @@ export class SplunkOnCallClient implements SplunkOnCallApi {
     options: RequestOptions,
   ): Promise<Response> {
     const response = await fetch(url, options);
-    if (response.status === 401) {
+    if (response.status === 403) {
       throw new UnauthorizedError();
     }
     if (!response.ok) {

plugins/splunk-on-call/src/api/types.ts

@@ -24,8 +24,8 @@ import {
 import { DiscoveryApi } from '@backstage/core';
 
 export enum TargetType {
-  User = 'User',
-  EscalationPolicy = 'EscalationPolicy',
+  UserValue = 'User',
+  EscalationPolicyValue = 'EscalationPolicy',
 }
 
 export type IncidentTarget = {

plugins/splunk-on-call/src/components/Escalation/EscalationPolicy.tsx

@@ -34,7 +34,7 @@ export const EscalationPolicy = ({ users, team }: Props) => {
 
   const { value: userNames, loading, error } = useAsync(async () => {
     const oncalls = await api.getOnCallUsers();
-    const users = oncalls
+    const teamUsernames = oncalls
       .filter(oncall => oncall.team?.name === team)
       .flatMap(oncall => {
         return oncall.oncallNow?.flatMap(oncallNow => {
@@ -43,7 +43,7 @@ export const EscalationPolicy = ({ users, team }: Props) => {
           });
         });
       });
-    return users;
+    return teamUsernames;
   });
 
   if (error) {

plugins/splunk-on-call/src/components/Incident/Incidents.tsx

@@ -33,11 +33,13 @@ export const Incidents = ({ refreshIncidents, team }: Props) => {
 
   const [{ value: incidents, loading, error }, getIncidents] = useAsyncFn(
     async () => {
-      const incidents = await api.getIncidents();
+      const allIncidents = await api.getIncidents();
       const teams = await api.getTeams();
       const teamSlug = teams.find(teamValue => teamValue.name === team)?.slug;
       const filteredIncidents = teamSlug
-        ? incidents.filter(incident => incident.pagedTeams?.includes(teamSlug))
+        ? allIncidents.filter(incident =>
+            incident.pagedTeams?.includes(teamSlug),
+          )
         : [];
       return filteredIncidents;
     },

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

@@ -69,7 +69,7 @@ export const MissingUsername = () => (
     <EmptyState
       title="No Splunk On-Call user available."
       missing="info"
-      description="You need to add a valid username to your 'app.config.yml' if you want to enable Splunk On-Call."
+      description="You need to add a valid username to your 'app.config.yml' if you want to enable Splunk On-Call. Make sure that the user is a member of your organization."
     />
   </CardContent>
 );

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

@@ -91,9 +91,9 @@ export const TriggerDialog = ({
 
   const [userTargets, setUserTargets] = useState<string[]>([]);
   const [policyTargets, setPolicyTargets] = useState<string[]>([]);
-  const [details, setDetails] = useState<string>('');
-  const [summary, setSummary] = useState<string>('');
-  const [isMultiResponder, setIsMultiResponder] = useState<string>('1');
+  const [detailsValue, setDetails] = useState<string>('');
+  const [summaryValue, setSummary] = useState<string>('');
+  const [isMultiResponderValue, setIsMultiResponder] = useState<string>('1');
 
   const [
     { value, loading: triggerLoading, error: triggerError },
@@ -120,8 +120,8 @@ export const TriggerDialog = ({
     loading: policiesLoaading,
     error: policiesError,
   } = useAsync(async () => {
-    const policies = await api.getEscalationPolicies();
-    return policies;
+    const allPolicies = await api.getEscalationPolicies();
+    return allPolicies;
   });
 
   const handleUserTargets = (event: React.ChangeEvent<{ value: unknown }>) => {
@@ -149,10 +149,10 @@ export const TriggerDialog = ({
   };
 
   const targets = (): IncidentTarget[] => [
-    ...userTargets.map(user => ({ slug: user, type: TargetType.User })),
+    ...userTargets.map(user => ({ slug: user, type: TargetType.UserValue })),
     ...policyTargets.map(user => ({
       slug: user,
-      type: TargetType.EscalationPolicy,
+      type: TargetType.EscalationPolicyValue,
     })),
   ];
 
@@ -175,7 +175,7 @@ export const TriggerDialog = ({
 
   return (
     <Dialog maxWidth="md" open={showDialog} onClose={handleDialog} fullWidth>
-      <DialogTitle>This action will trigger an incident.</DialogTitle>
+      <DialogTitle>This action will trigger an incident</DialogTitle>
       <DialogContent>
         <Typography variant="subtitle1" gutterBottom align="justify">
           Created by:{' '}
@@ -218,13 +218,13 @@ export const TriggerDialog = ({
                 input={<Input />}
                 renderValue={selected => (
                   <div className={classes.chips}>
-                    {(selected as string[]).map(value => {
+                    {(selected as string[]).map(selectedUser => {
                       const element = users.find(
-                        user => user.username === value,
+                        user => user.username === selectedUser,
                       );
                       return (
                         <Chip
-                          key={value}
+                          key={selectedUser}
                           label={`${element?.firstName} ${element?.lastName}`}
                           className={classes.chip}
                         />
@@ -251,13 +251,13 @@ export const TriggerDialog = ({
                 input={<Input />}
                 renderValue={selected => (
                   <div className={classes.chips}>
-                    {(selected as string[]).map(value => {
+                    {(selected as string[]).map(selectedPolicy => {
                       const element = policies?.find(
-                        policy => policy.policy.slug === value,
+                        policy => policy.policy.slug === selectedPolicy,
                       );
                       return (
                         <Chip
-                          key={value}
+                          key={selectedPolicy}
                           label={element?.policy.name}
                           className={classes.chip}
                         />
@@ -292,7 +292,7 @@ export const TriggerDialog = ({
         <FormControl className={classes.formControl}>
           <Select
             id="multi-responder"
-            value={isMultiResponder}
+            value={isMultiResponderValue}
             onChange={isMultiResponderChanged}
             inputProps={{ 'data-testid': 'trigger-select-behavior' }}
           >
@@ -337,19 +337,19 @@ export const TriggerDialog = ({
           id="trigger"
           color="secondary"
           disabled={
-            !details ||
-            !summary ||
+            !detailsValue ||
+            !summaryValue ||
             (!userTargets.length && !policyTargets.length) ||
             triggerLoading
           }
           variant="contained"
           onClick={() =>
             handleTriggerAlarm(
-              summary,
-              details,
+              summaryValue,
+              detailsValue,
               incidentCreator.username!,
               targets(),
-              !!Number(isMultiResponder),
+              !!Number(isMultiResponderValue),
             )
           }
           endIcon={triggerLoading && <CircularProgress size={16} />}