@backstage-community/plugin-entity-feedback 0.2.18

package/README.md

@@ -0,0 +1,140 @@
+# Entity Feedback Plugin
+
+Welcome to the entity-feedback plugin!
+
+This plugin allows you give and view feedback on entities available in the Backstage catalog.
+
+## Features
+
+### Rate entities
+
+#### Like/Dislike rating
+
+![Like dislike rating example](./docs/like-dislike-rating.png)
+
+#### Starred rating
+
+![Starred rating example](./docs/starred-rating.png)
+
+### Request additional feedback when poorly rated
+
+![Response dialog example](./docs/feedback-response-dialog.png)
+
+### View entity feedback responses
+
+![Feedback responses example](./docs/feedback-response-table.png)
+
+### View aggregated ratings on owned entities
+
+#### Total likes/dislikes
+
+![Like dislike table example](./docs/like-dislike-table.png)
+
+#### Star breakdowns
+
+![Starred rating table example](./docs/starred-rating-table.png)
+
+## Setup
+
+The following sections will help you get the Entity Feedback plugin setup and running.
+
+Note: this plugin requires authentication and identity configured so Backstage can identify
+which user has rated the entity. If you are using the guest identity provider which comes
+out of the box, this plugin will not work when you test it.
+
+### Backend
+
+You need to setup the [Entity Feedback backend plugin](https://github.com/backstage/backstage/tree/master/plugins/entity-feedback-backend) before you move forward with any of these steps if you haven't already
+
+### Installation
+
+Install this plugin:
+
+```bash
+# From your Backstage root directory
+yarn --cwd packages/app add @backstage-community/plugin-entity-feedback
+```
+
+### Entity Pages
+
+Add rating and feedback components to your `EntityPage.tsx` to hook up UI so that users
+can rate your entities and for owners to view feedback/responses.
+
+To allow users to apply "Like" and "Dislike" ratings add the following to each kind/type of
+entity in your `EntityPage.tsx` you want to be rated (if you prefer to use star ratings, replace
+`EntityLikeDislikeRatingsCard` with `EntityStarredRatingsCard` and `LikeDislikeButtons` with
+`StarredRatingButtons`):
+
+```diff
+import {
+  ...
++ InfoCard,
+  ...
+} from '@backstage/core-components';
++import {
++ EntityFeedbackResponseContent,
++ EntityLikeDislikeRatingsCard,
++ LikeDislikeButtons,
++} from '@backstage-community/plugin-entity-feedback';
+
+// Add to each applicable kind/type of entity as desired
+const overviewContent = (
+  <Grid container spacing={3} alignItems="stretch">
+    ...
++   <Grid item md={2}>
++     <InfoCard title="Rate this entity">
++       <LikeDislikeButtons />
++     </InfoCard>
++   </Grid>
+    ...
+  </Grid>
+);
+
+...
+
+// Add to each applicable kind/type of entity as desired
+const serviceEntityPage = (
+  <EntityLayoutWrapper>
+    ...
++   <EntityLayout.Route path="/feedback" title="Feedback">
++     <EntityFeedbackResponseContent />
++   </EntityLayout.Route>
+    ...
+  </EntityLayoutWrapper>
+);
+
+...
+
+// Add ratings card component to user/group entities to view ratings of owned entities
+const userPage = (
+  <EntityLayoutWrapper>
+    <EntityLayout.Route path="/" title="Overview">
+      <Grid container spacing={3}>
+        ...
++       <Grid item xs={12}>
++         <EntityLikeDislikeRatingsCard />
++       </Grid>
+        ...
+        </Grid>
+      </Grid>
+    </EntityLayout.Route>
+  </EntityLayoutWrapper>
+);
+
+const groupPage = (
+  <EntityLayoutWrapper>
+    <EntityLayout.Route path="/" title="Overview">
+      <Grid container spacing={3}>
+        ...
++       <Grid item xs={12}>
++         <EntityLikeDislikeRatingsCard />
++       </Grid>
+        ...
+        </Grid>
+      </Grid>
+    </EntityLayout.Route>
+  </EntityLayoutWrapper>
+);
+```
+
+Note: For a full example of this you can look at [this EntityPage](../../packages/app/src/components/catalog/EntityPage.tsx).

package/dist/esm/FeedbackRatingsTable-O2SrWgAE.esm.js

@@ -0,0 +1,99 @@
+import { parseEntityRef } from '@backstage/catalog-model';
+import { SubvalueCell, ErrorPanel, Table } from '@backstage/core-components';
+import { useApi } from '@backstage/core-plugin-api';
+import { EntityRefLink } from '@backstage/plugin-catalog-react';
+import React from 'react';
+import useAsync from 'react-use/esm/useAsync';
+import '@backstage/errors';
+import { entityFeedbackApiRef } from '../index.esm.js';
+
+const FeedbackRatingsTable = (props) => {
+  const {
+    allEntities,
+    ownerRef,
+    ratingValues,
+    title = "Entity Ratings"
+  } = props;
+  const feedbackApi = useApi(entityFeedbackApiRef);
+  const {
+    error,
+    loading,
+    value: ratings
+  } = useAsync(async () => {
+    if (allEntities) {
+      return feedbackApi.getAllRatings();
+    }
+    if (!ownerRef) {
+      return [];
+    }
+    return feedbackApi.getOwnedRatings(ownerRef);
+  }, [allEntities, feedbackApi, ownerRef]);
+  const columns = [
+    { title: "Title", field: "entityTitle", hidden: true, searchable: true },
+    {
+      title: "Entity",
+      field: "entityRef",
+      highlight: true,
+      customSort: (a, b) => {
+        var _a, _b;
+        const titleA = (_a = a.entityTitle) != null ? _a : parseEntityRef(a.entityRef).name;
+        const titleB = (_b = b.entityTitle) != null ? _b : parseEntityRef(b.entityRef).name;
+        return titleA.localeCompare(titleB);
+      },
+      render: (rating) => {
+        const compoundRef = parseEntityRef(rating.entityRef);
+        return /* @__PURE__ */ React.createElement(
+          SubvalueCell,
+          {
+            value: /* @__PURE__ */ React.createElement(
+              EntityRefLink,
+              {
+                entityRef: rating.entityRef,
+                defaultKind: compoundRef.kind,
+                title: rating.entityTitle
+              }
+            ),
+            subvalue: compoundRef.kind
+          }
+        );
+      }
+    },
+    ...ratingValues.map((ratingVal) => ({
+      title: ratingVal,
+      field: `ratings.${ratingVal}`
+    }))
+  ];
+  const ratingsRows = ratings == null ? void 0 : ratings.filter(
+    (r) => Object.keys(r.ratings).some((v) => ratingValues.includes(v))
+  );
+  if (error) {
+    return /* @__PURE__ */ React.createElement(
+      ErrorPanel,
+      {
+        defaultExpanded: true,
+        title: "Failed to load feedback ratings",
+        error
+      }
+    );
+  }
+  return /* @__PURE__ */ React.createElement(
+    Table,
+    {
+      columns,
+      data: ratingsRows != null ? ratingsRows : [],
+      isLoading: loading,
+      options: {
+        emptyRowsWhenPaging: false,
+        loadingType: "linear",
+        pageSize: 20,
+        pageSizeOptions: [20, 50, 100],
+        paging: true,
+        showEmptyDataSourceMessage: !loading
+      },
+      title
+    }
+  );
+};
+
+export { FeedbackRatingsTable as F };
+//# sourceMappingURL=FeedbackRatingsTable-O2SrWgAE.esm.js.map

package/dist/esm/FeedbackRatingsTable-O2SrWgAE.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeedbackRatingsTable-O2SrWgAE.esm.js","sources":["../../src/components/FeedbackRatingsTable/FeedbackRatingsTable.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { parseEntityRef } from '@backstage/catalog-model';\nimport { ErrorPanel, SubvalueCell, Table } from '@backstage/core-components';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { EntityRatingsData } from '@backstage-community/plugin-entity-feedback-common';\nimport React from 'react';\nimport useAsync from 'react-use/esm/useAsync';\n\nimport { entityFeedbackApiRef } from '../../api';\n\ninterface FeedbackRatingsTableProps {\n  allEntities?: boolean;\n  ownerRef?: string;\n  ratingValues: string[];\n  title?: string;\n}\n\nexport const FeedbackRatingsTable = (props: FeedbackRatingsTableProps) => {\n  const {\n    allEntities,\n    ownerRef,\n    ratingValues,\n    title = 'Entity Ratings',\n  } = props;\n  const feedbackApi = useApi(entityFeedbackApiRef);\n\n  const {\n    error,\n    loading,\n    value: ratings,\n  } = useAsync(async () => {\n    if (allEntities) {\n      return feedbackApi.getAllRatings();\n    }\n\n    if (!ownerRef) {\n      return [];\n    }\n\n    return feedbackApi.getOwnedRatings(ownerRef);\n  }, [allEntities, feedbackApi, ownerRef]);\n\n  const columns = [\n    { title: 'Title', field: 'entityTitle', hidden: true, searchable: true },\n    {\n      title: 'Entity',\n      field: 'entityRef',\n      highlight: true,\n      customSort: (a: EntityRatingsData, b: EntityRatingsData) => {\n        const titleA = a.entityTitle ?? parseEntityRef(a.entityRef).name;\n        const titleB = b.entityTitle ?? parseEntityRef(b.entityRef).name;\n        return titleA.localeCompare(titleB);\n      },\n      render: (rating: EntityRatingsData) => {\n        const compoundRef = parseEntityRef(rating.entityRef);\n        return (\n          <SubvalueCell\n            value={\n              <EntityRefLink\n                entityRef={rating.entityRef}\n                defaultKind={compoundRef.kind}\n                title={rating.entityTitle}\n              />\n            }\n            subvalue={compoundRef.kind}\n          />\n        );\n      },\n    },\n    ...ratingValues.map(ratingVal => ({\n      title: ratingVal,\n      field: `ratings.${ratingVal}`,\n    })),\n  ];\n\n  // Exclude entities that don't have applicable ratings\n  const ratingsRows = ratings?.filter(r =>\n    Object.keys(r.ratings).some(v => ratingValues.includes(v)),\n  );\n\n  if (error) {\n    return (\n      <ErrorPanel\n        defaultExpanded\n        title=\"Failed to load feedback ratings\"\n        error={error}\n      />\n    );\n  }\n\n  return (\n    <Table<EntityRatingsData>\n      columns={columns}\n      data={ratingsRows ?? []}\n      isLoading={loading}\n      options={{\n        emptyRowsWhenPaging: false,\n        loadingType: 'linear',\n        pageSize: 20,\n        pageSizeOptions: [20, 50, 100],\n        paging: true,\n        showEmptyDataSourceMessage: !loading,\n      }}\n      title={title}\n    />\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/FeedbackResponseDialog-FxuGsr7u.esm.js

@@ -0,0 +1,112 @@
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { Progress } from '@backstage/core-components';
+import { useApi, errorApiRef } from '@backstage/core-plugin-api';
+import Button from '@material-ui/core/Button';
+import Checkbox from '@material-ui/core/Checkbox';
+import Dialog from '@material-ui/core/Dialog';
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import FormControl from '@material-ui/core/FormControl';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+import FormGroup from '@material-ui/core/FormGroup';
+import FormLabel from '@material-ui/core/FormLabel';
+import Grid from '@material-ui/core/Grid';
+import Switch from '@material-ui/core/Switch';
+import TextField from '@material-ui/core/TextField';
+import Typography from '@material-ui/core/Typography';
+import { makeStyles } from '@material-ui/core/styles';
+import React, { useState } from 'react';
+import useAsyncFn from 'react-use/esm/useAsyncFn';
+import '@backstage/errors';
+import { entityFeedbackApiRef } from '../index.esm.js';
+
+const defaultFeedbackResponses = [
+  { id: "incorrect", label: "Incorrect info" },
+  { id: "missing", label: "Missing info" },
+  { id: "other", label: "Other (please specify below)" }
+];
+const useStyles = makeStyles({
+  contactConsent: {
+    marginTop: "5px"
+  }
+});
+const FeedbackResponseDialog = (props) => {
+  const {
+    entity,
+    feedbackDialogResponses = defaultFeedbackResponses,
+    feedbackDialogTitle = "Please provide feedback on what can be improved",
+    open,
+    onClose
+  } = props;
+  const classes = useStyles();
+  const errorApi = useApi(errorApiRef);
+  const feedbackApi = useApi(entityFeedbackApiRef);
+  const [responseSelections, setResponseSelections] = useState(
+    Object.fromEntries(feedbackDialogResponses.map((r) => [r.id, false]))
+  );
+  const [comments, setComments] = useState("");
+  const [consent, setConsent] = useState(true);
+  const [{ loading: saving }, saveResponse] = useAsyncFn(async () => {
+    try {
+      await feedbackApi.recordResponse(stringifyEntityRef(entity), {
+        comments,
+        consent,
+        response: Object.keys(responseSelections).filter((id) => responseSelections[id]).join(",")
+      });
+      onClose();
+    } catch (e) {
+      errorApi.post(e);
+    }
+  }, [comments, consent, entity, feedbackApi, onClose, responseSelections]);
+  return /* @__PURE__ */ React.createElement(Dialog, { open, onClose: () => !saving && onClose() }, saving && /* @__PURE__ */ React.createElement(Progress, null), /* @__PURE__ */ React.createElement(DialogTitle, null, feedbackDialogTitle), /* @__PURE__ */ React.createElement(DialogContent, null, /* @__PURE__ */ React.createElement(FormControl, { component: "fieldset" }, /* @__PURE__ */ React.createElement(FormLabel, { component: "legend" }, "Choose all that apply"), /* @__PURE__ */ React.createElement(FormGroup, null, feedbackDialogResponses.map((response) => /* @__PURE__ */ React.createElement(
+    FormControlLabel,
+    {
+      key: response.id,
+      control: /* @__PURE__ */ React.createElement(
+        Checkbox,
+        {
+          checked: responseSelections[response.id],
+          disabled: saving,
+          name: response.id,
+          onChange: (e) => setResponseSelections({
+            ...responseSelections,
+            [e.target.name]: e.target.checked
+          })
+        }
+      ),
+      label: response.label
+    }
+  )))), /* @__PURE__ */ React.createElement(FormControl, { fullWidth: true }, /* @__PURE__ */ React.createElement(
+    TextField,
+    {
+      "data-testid": "feedback-response-dialog-comments-input",
+      disabled: saving,
+      label: "Additional comments",
+      multiline: true,
+      minRows: 2,
+      onChange: (e) => setComments(e.target.value),
+      variant: "outlined",
+      value: comments
+    }
+  )), /* @__PURE__ */ React.createElement(Typography, { className: classes.contactConsent }, "Can we reach out to you for more info?", /* @__PURE__ */ React.createElement(Grid, { component: "label", container: true, alignItems: "center", spacing: 1 }, /* @__PURE__ */ React.createElement(Grid, { item: true }, "No"), /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
+    Switch,
+    {
+      checked: consent,
+      disabled: saving,
+      onChange: (e) => setConsent(e.target.checked)
+    }
+  )), /* @__PURE__ */ React.createElement(Grid, { item: true }, "Yes")))), /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(Button, { color: "primary", disabled: saving, onClick: onClose }, "Close"), /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      color: "primary",
+      "data-testid": "feedback-response-dialog-submit-button",
+      disabled: saving,
+      onClick: saveResponse
+    },
+    "Submit"
+  )));
+};
+
+export { FeedbackResponseDialog as F };
+//# sourceMappingURL=FeedbackResponseDialog-FxuGsr7u.esm.js.map

package/dist/esm/FeedbackResponseDialog-FxuGsr7u.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeedbackResponseDialog-FxuGsr7u.esm.js","sources":["../../src/components/FeedbackResponseDialog/FeedbackResponseDialog.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Entity, stringifyEntityRef } from '@backstage/catalog-model';\nimport { Progress } from '@backstage/core-components';\nimport { ErrorApiError, errorApiRef, useApi } from '@backstage/core-plugin-api';\nimport Button from '@material-ui/core/Button';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport DialogTitle from '@material-ui/core/DialogTitle';\nimport FormControl from '@material-ui/core/FormControl';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport FormGroup from '@material-ui/core/FormGroup';\nimport FormLabel from '@material-ui/core/FormLabel';\nimport Grid from '@material-ui/core/Grid';\nimport Switch from '@material-ui/core/Switch';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport React, { ReactNode, useState } from 'react';\nimport useAsyncFn from 'react-use/esm/useAsyncFn';\n\nimport { entityFeedbackApiRef } from '../../api';\n\n/**\n * @public\n */\nexport interface EntityFeedbackResponse {\n  id: string;\n  label: string;\n}\n\nconst defaultFeedbackResponses: EntityFeedbackResponse[] = [\n  { id: 'incorrect', label: 'Incorrect info' },\n  { id: 'missing', label: 'Missing info' },\n  { id: 'other', label: 'Other (please specify below)' },\n];\n\n/**\n * @public\n */\nexport interface FeedbackResponseDialogProps {\n  entity: Entity;\n  feedbackDialogResponses?: EntityFeedbackResponse[];\n  feedbackDialogTitle?: ReactNode;\n  open: boolean;\n  onClose: () => void;\n}\n\nconst useStyles = makeStyles({\n  contactConsent: {\n    marginTop: '5px',\n  },\n});\n\nexport const FeedbackResponseDialog = (props: FeedbackResponseDialogProps) => {\n  const {\n    entity,\n    feedbackDialogResponses = defaultFeedbackResponses,\n    feedbackDialogTitle = 'Please provide feedback on what can be improved',\n    open,\n    onClose,\n  } = props;\n  const classes = useStyles();\n  const errorApi = useApi(errorApiRef);\n  const feedbackApi = useApi(entityFeedbackApiRef);\n  const [responseSelections, setResponseSelections] = useState(\n    Object.fromEntries(feedbackDialogResponses.map(r => [r.id, false])),\n  );\n  const [comments, setComments] = useState('');\n  const [consent, setConsent] = useState(true);\n\n  const [{ loading: saving }, saveResponse] = useAsyncFn(async () => {\n    try {\n      await feedbackApi.recordResponse(stringifyEntityRef(entity), {\n        comments,\n        consent,\n        response: Object.keys(responseSelections)\n          .filter(id => responseSelections[id])\n          .join(','),\n      });\n      onClose();\n    } catch (e) {\n      errorApi.post(e as ErrorApiError);\n    }\n  }, [comments, consent, entity, feedbackApi, onClose, responseSelections]);\n\n  return (\n    <Dialog open={open} onClose={() => !saving && onClose()}>\n      {saving && <Progress />}\n      <DialogTitle>{feedbackDialogTitle}</DialogTitle>\n      <DialogContent>\n        <FormControl component=\"fieldset\">\n          <FormLabel component=\"legend\">Choose all that apply</FormLabel>\n          <FormGroup>\n            {feedbackDialogResponses.map(response => (\n              <FormControlLabel\n                key={response.id}\n                control={\n                  <Checkbox\n                    checked={responseSelections[response.id]}\n                    disabled={saving}\n                    name={response.id}\n                    onChange={e =>\n                      setResponseSelections({\n                        ...responseSelections,\n                        [e.target.name]: e.target.checked,\n                      })\n                    }\n                  />\n                }\n                label={response.label}\n              />\n            ))}\n          </FormGroup>\n        </FormControl>\n        <FormControl fullWidth>\n          <TextField\n            data-testid=\"feedback-response-dialog-comments-input\"\n            disabled={saving}\n            label=\"Additional comments\"\n            multiline\n            minRows={2}\n            onChange={e => setComments(e.target.value)}\n            variant=\"outlined\"\n            value={comments}\n          />\n        </FormControl>\n        <Typography className={classes.contactConsent}>\n          Can we reach out to you for more info?\n          <Grid component=\"label\" container alignItems=\"center\" spacing={1}>\n            <Grid item>No</Grid>\n            <Grid item>\n              <Switch\n                checked={consent}\n                disabled={saving}\n                onChange={e => setConsent(e.target.checked)}\n              />\n            </Grid>\n            <Grid item>Yes</Grid>\n          </Grid>\n        </Typography>\n      </DialogContent>\n      <DialogActions>\n        <Button color=\"primary\" disabled={saving} onClick={onClose}>\n          Close\n        </Button>\n        <Button\n          color=\"primary\"\n          data-testid=\"feedback-response-dialog-submit-button\"\n          disabled={saving}\n          onClick={saveResponse}\n        >\n          Submit\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/LikeDislikeButtons-D7M8hiAk.esm.js

@@ -0,0 +1,109 @@
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { Progress } from '@backstage/core-components';
+import { useApi, errorApiRef, identityApiRef } from '@backstage/core-plugin-api';
+import { useAsyncEntity } from '@backstage/plugin-catalog-react';
+import IconButton from '@material-ui/core/IconButton';
+import Tooltip from '@material-ui/core/Tooltip';
+import ThumbDownIcon from '@material-ui/icons/ThumbDown';
+import ThumbUpIcon from '@material-ui/icons/ThumbUp';
+import ThumbDownOutlinedIcon from '@material-ui/icons/ThumbDownOutlined';
+import ThumbUpOutlinedIcon from '@material-ui/icons/ThumbUpOutlined';
+import React, { useState, useCallback } from 'react';
+import useAsync from 'react-use/esm/useAsync';
+import useAsyncFn from 'react-use/esm/useAsyncFn';
+import '@backstage/errors';
+import { entityFeedbackApiRef } from '../index.esm.js';
+import { F as FeedbackResponseDialog } from './FeedbackResponseDialog-FxuGsr7u.esm.js';
+
+var FeedbackRatings = /* @__PURE__ */ ((FeedbackRatings2) => {
+  FeedbackRatings2["like"] = "LIKE";
+  FeedbackRatings2["dislike"] = "DISLIKE";
+  FeedbackRatings2["neutral"] = "NEUTRAL";
+  return FeedbackRatings2;
+})(FeedbackRatings || {});
+const LikeDislikeButtons = (props) => {
+  const {
+    feedbackDialogResponses,
+    feedbackDialogTitle,
+    requestResponse = true
+  } = props;
+  const errorApi = useApi(errorApiRef);
+  const feedbackApi = useApi(entityFeedbackApiRef);
+  const identityApi = useApi(identityApiRef);
+  const [rating, setRating] = useState(
+    "NEUTRAL" /* neutral */
+  );
+  const [openFeedbackDialog, setOpenFeedbackDialog] = useState(false);
+  const { entity, loading: loadingEntity } = useAsyncEntity();
+  const { loading: loadingFeedback } = useAsync(async () => {
+    var _a, _b;
+    if (!entity) {
+      return;
+    }
+    try {
+      const identity = await identityApi.getBackstageIdentity();
+      const prevFeedback = await feedbackApi.getRatings(
+        stringifyEntityRef(entity)
+      );
+      setRating(
+        (_b = (_a = prevFeedback.find((r) => r.userRef === identity.userEntityRef)) == null ? void 0 : _a.rating) != null ? _b : rating
+      );
+    } catch (e) {
+      errorApi.post(e);
+    }
+  }, [entity, feedbackApi, setRating]);
+  const [{ loading: savingFeedback }, saveFeedback] = useAsyncFn(
+    async (feedback) => {
+      try {
+        await feedbackApi.recordRating(stringifyEntityRef(entity), feedback);
+        setRating(feedback);
+      } catch (e) {
+        errorApi.post(e);
+      }
+    },
+    [entity, feedbackApi, setRating]
+  );
+  const applyRating = useCallback(
+    (feedback) => {
+      if (feedback === rating) {
+        saveFeedback("NEUTRAL" /* neutral */);
+        return;
+      }
+      saveFeedback(feedback);
+      if (feedback === "DISLIKE" /* dislike */ && requestResponse) {
+        setOpenFeedbackDialog(true);
+      }
+    },
+    [rating, requestResponse, saveFeedback, setOpenFeedbackDialog]
+  );
+  if (loadingEntity || loadingFeedback || savingFeedback) {
+    return /* @__PURE__ */ React.createElement(Progress, null);
+  }
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    IconButton,
+    {
+      "data-testid": "entity-feedback-like-button",
+      onClick: () => applyRating("LIKE" /* like */)
+    },
+    rating === "LIKE" /* like */ ? /* @__PURE__ */ React.createElement(Tooltip, { title: "Liked" }, /* @__PURE__ */ React.createElement(ThumbUpIcon, { fontSize: "small" })) : /* @__PURE__ */ React.createElement(Tooltip, { title: "Like" }, /* @__PURE__ */ React.createElement(ThumbUpOutlinedIcon, { fontSize: "small" }))
+  ), /* @__PURE__ */ React.createElement(
+    IconButton,
+    {
+      "data-testid": "entity-feedback-dislike-button",
+      onClick: () => applyRating("DISLIKE" /* dislike */)
+    },
+    rating === "DISLIKE" /* dislike */ ? /* @__PURE__ */ React.createElement(Tooltip, { title: "Disliked" }, /* @__PURE__ */ React.createElement(ThumbDownIcon, { fontSize: "small" })) : /* @__PURE__ */ React.createElement(Tooltip, { title: "Dislike" }, /* @__PURE__ */ React.createElement(ThumbDownOutlinedIcon, { fontSize: "small" }))
+  ), /* @__PURE__ */ React.createElement(
+    FeedbackResponseDialog,
+    {
+      entity,
+      open: openFeedbackDialog,
+      onClose: () => setOpenFeedbackDialog(false),
+      feedbackDialogResponses,
+      feedbackDialogTitle
+    }
+  ));
+};
+
+export { FeedbackRatings as F, LikeDislikeButtons as L };
+//# sourceMappingURL=LikeDislikeButtons-D7M8hiAk.esm.js.map

package/dist/esm/LikeDislikeButtons-D7M8hiAk.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LikeDislikeButtons-D7M8hiAk.esm.js","sources":["../../src/components/LikeDislikeButtons/LikeDislikeButtons.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { stringifyEntityRef } from '@backstage/catalog-model';\nimport { Progress } from '@backstage/core-components';\nimport {\n  ErrorApiError,\n  errorApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport { useAsyncEntity } from '@backstage/plugin-catalog-react';\nimport IconButton from '@material-ui/core/IconButton';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport ThumbDownIcon from '@material-ui/icons/ThumbDown';\nimport ThumbUpIcon from '@material-ui/icons/ThumbUp';\nimport ThumbDownOutlinedIcon from '@material-ui/icons/ThumbDownOutlined';\nimport ThumbUpOutlinedIcon from '@material-ui/icons/ThumbUpOutlined';\nimport React, { ReactNode, useCallback, useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport useAsyncFn from 'react-use/esm/useAsyncFn';\n\nimport { entityFeedbackApiRef } from '../../api';\nimport {\n  EntityFeedbackResponse,\n  FeedbackResponseDialog,\n} from '../FeedbackResponseDialog';\n\nexport enum FeedbackRatings {\n  like = 'LIKE',\n  dislike = 'DISLIKE',\n  neutral = 'NEUTRAL',\n}\n\n/**\n * @public\n */\nexport interface LikeDislikeButtonsProps {\n  feedbackDialogResponses?: EntityFeedbackResponse[];\n  feedbackDialogTitle?: ReactNode;\n  requestResponse?: boolean;\n}\n\nexport const LikeDislikeButtons = (props: LikeDislikeButtonsProps) => {\n  const {\n    feedbackDialogResponses,\n    feedbackDialogTitle,\n    requestResponse = true,\n  } = props;\n  const errorApi = useApi(errorApiRef);\n  const feedbackApi = useApi(entityFeedbackApiRef);\n  const identityApi = useApi(identityApiRef);\n  const [rating, setRating] = useState<FeedbackRatings>(\n    FeedbackRatings.neutral,\n  );\n  const [openFeedbackDialog, setOpenFeedbackDialog] = useState(false);\n  const { entity, loading: loadingEntity } = useAsyncEntity();\n\n  const { loading: loadingFeedback } = useAsync(async () => {\n    // Wait until entity is loaded\n    if (!entity) {\n      return;\n    }\n\n    try {\n      const identity = await identityApi.getBackstageIdentity();\n      const prevFeedback = await feedbackApi.getRatings(\n        stringifyEntityRef(entity),\n      );\n      setRating(\n        (prevFeedback.find(r => r.userRef === identity.userEntityRef)?.rating ??\n          rating) as FeedbackRatings,\n      );\n    } catch (e) {\n      errorApi.post(e as ErrorApiError);\n    }\n  }, [entity, feedbackApi, setRating]);\n\n  const [{ loading: savingFeedback }, saveFeedback] = useAsyncFn(\n    async (feedback: FeedbackRatings) => {\n      try {\n        await feedbackApi.recordRating(stringifyEntityRef(entity!), feedback);\n        setRating(feedback);\n      } catch (e) {\n        errorApi.post(e as ErrorApiError);\n      }\n    },\n    [entity, feedbackApi, setRating],\n  );\n\n  const applyRating = useCallback(\n    (feedback: FeedbackRatings) => {\n      // Clear rating if feedback is same as current\n      if (feedback === rating) {\n        saveFeedback(FeedbackRatings.neutral);\n        return;\n      }\n\n      saveFeedback(feedback);\n      if (feedback === FeedbackRatings.dislike && requestResponse) {\n        setOpenFeedbackDialog(true);\n      }\n    },\n    [rating, requestResponse, saveFeedback, setOpenFeedbackDialog],\n  );\n\n  if (loadingEntity || loadingFeedback || savingFeedback) {\n    return <Progress />;\n  }\n\n  return (\n    <>\n      <IconButton\n        data-testid=\"entity-feedback-like-button\"\n        onClick={() => applyRating(FeedbackRatings.like)}\n      >\n        {rating === FeedbackRatings.like ? (\n          <Tooltip title=\"Liked\">\n            <ThumbUpIcon fontSize=\"small\" />\n          </Tooltip>\n        ) : (\n          <Tooltip title=\"Like\">\n            <ThumbUpOutlinedIcon fontSize=\"small\" />\n          </Tooltip>\n        )}\n      </IconButton>\n      <IconButton\n        data-testid=\"entity-feedback-dislike-button\"\n        onClick={() => applyRating(FeedbackRatings.dislike)}\n      >\n        {rating === FeedbackRatings.dislike ? (\n          <Tooltip title=\"Disliked\">\n            <ThumbDownIcon fontSize=\"small\" />\n          </Tooltip>\n        ) : (\n          <Tooltip title=\"Dislike\">\n            <ThumbDownOutlinedIcon fontSize=\"small\" />\n          </Tooltip>\n        )}\n      </IconButton>\n      <FeedbackResponseDialog\n        entity={entity!}\n        open={openFeedbackDialog}\n        onClose={() => setOpenFeedbackDialog(false)}\n        feedbackDialogResponses={feedbackDialogResponses}\n        feedbackDialogTitle={feedbackDialogTitle}\n      />\n    </>\n  );\n};\n"],"names":["FeedbackRatings"],"mappings":"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"}

package/dist/esm/StarredRatingButtons-7kGQPIqk.esm.js

@@ -0,0 +1,112 @@
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { Progress } from '@backstage/core-components';
+import { useApi, errorApiRef, identityApiRef } from '@backstage/core-plugin-api';
+import { useAsyncEntity } from '@backstage/plugin-catalog-react';
+import IconButton from '@material-ui/core/IconButton';
+import StarOutlineIcon from '@material-ui/icons/StarOutline';
+import StarIcon from '@material-ui/icons/Star';
+import React, { useState, useCallback } from 'react';
+import useAsync from 'react-use/esm/useAsync';
+import useAsyncFn from 'react-use/esm/useAsyncFn';
+import '@backstage/errors';
+import { entityFeedbackApiRef } from '../index.esm.js';
+import { F as FeedbackResponseDialog } from './FeedbackResponseDialog-FxuGsr7u.esm.js';
+
+var FeedbackRatings = /* @__PURE__ */ ((FeedbackRatings2) => {
+  FeedbackRatings2[FeedbackRatings2["one"] = 1] = "one";
+  FeedbackRatings2[FeedbackRatings2["two"] = 2] = "two";
+  FeedbackRatings2[FeedbackRatings2["three"] = 3] = "three";
+  FeedbackRatings2[FeedbackRatings2["four"] = 4] = "four";
+  FeedbackRatings2[FeedbackRatings2["five"] = 5] = "five";
+  return FeedbackRatings2;
+})(FeedbackRatings || {});
+const StarredRatingButtons = (props) => {
+  const {
+    feedbackDialogResponses,
+    feedbackDialogTitle,
+    requestResponse = true,
+    requestResponseThreshold = 2 /* two */
+  } = props;
+  const errorApi = useApi(errorApiRef);
+  const feedbackApi = useApi(entityFeedbackApiRef);
+  const identityApi = useApi(identityApiRef);
+  const [rating, setRating] = useState();
+  const [openFeedbackDialog, setOpenFeedbackDialog] = useState(false);
+  const { entity, loading: loadingEntity } = useAsyncEntity();
+  const { loading: loadingFeedback } = useAsync(async () => {
+    var _a;
+    if (!entity) {
+      return;
+    }
+    try {
+      const identity = await identityApi.getBackstageIdentity();
+      const prevFeedback = await feedbackApi.getRatings(
+        stringifyEntityRef(entity)
+      );
+      const prevRating = (_a = prevFeedback.find(
+        (r) => r.userRef === identity.userEntityRef
+      )) == null ? void 0 : _a.rating;
+      if (prevRating) {
+        setRating(parseInt(prevRating, 10));
+      }
+    } catch (e) {
+      errorApi.post(e);
+    }
+  }, [entity, feedbackApi, setRating]);
+  const [{ loading: savingFeedback }, saveFeedback] = useAsyncFn(
+    async (feedback) => {
+      try {
+        await feedbackApi.recordRating(
+          stringifyEntityRef(entity),
+          feedback.toString()
+        );
+        setRating(feedback);
+      } catch (e) {
+        errorApi.post(e);
+      }
+    },
+    [entity, feedbackApi, setRating]
+  );
+  const applyRating = useCallback(
+    (feedback) => {
+      if (feedback === rating) {
+        return;
+      }
+      saveFeedback(feedback);
+      if (feedback <= requestResponseThreshold && requestResponse) {
+        setOpenFeedbackDialog(true);
+      }
+    },
+    [
+      rating,
+      requestResponse,
+      requestResponseThreshold,
+      saveFeedback,
+      setOpenFeedbackDialog
+    ]
+  );
+  if (loadingEntity || loadingFeedback || savingFeedback) {
+    return /* @__PURE__ */ React.createElement(Progress, null);
+  }
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, Object.values(FeedbackRatings).filter((o) => typeof o === "number").map((starRating) => /* @__PURE__ */ React.createElement(
+    IconButton,
+    {
+      key: starRating,
+      "data-testid": `entity-feedback-star-button-${starRating}`,
+      onClick: () => applyRating(starRating)
+    },
+    rating && rating >= starRating ? /* @__PURE__ */ React.createElement(StarIcon, { fontSize: "small" }) : /* @__PURE__ */ React.createElement(StarOutlineIcon, { fontSize: "small" })
+  )), /* @__PURE__ */ React.createElement(
+    FeedbackResponseDialog,
+    {
+      entity,
+      open: openFeedbackDialog,
+      onClose: () => setOpenFeedbackDialog(false),
+      feedbackDialogResponses,
+      feedbackDialogTitle
+    }
+  ));
+};
+
+export { FeedbackRatings as F, StarredRatingButtons as S };
+//# sourceMappingURL=StarredRatingButtons-7kGQPIqk.esm.js.map

package/dist/esm/StarredRatingButtons-7kGQPIqk.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StarredRatingButtons-7kGQPIqk.esm.js","sources":["../../src/components/StarredRatingButtons/StarredRatingButtons.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { stringifyEntityRef } from '@backstage/catalog-model';\nimport { Progress } from '@backstage/core-components';\nimport {\n  ErrorApiError,\n  errorApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport { useAsyncEntity } from '@backstage/plugin-catalog-react';\nimport IconButton from '@material-ui/core/IconButton';\nimport StarOutlineIcon from '@material-ui/icons/StarOutline';\nimport StarIcon from '@material-ui/icons/Star';\nimport React, { ReactNode, useCallback, useState } from 'react';\nimport useAsync from 'react-use/esm/useAsync';\nimport useAsyncFn from 'react-use/esm/useAsyncFn';\n\nimport { entityFeedbackApiRef } from '../../api';\nimport {\n  EntityFeedbackResponse,\n  FeedbackResponseDialog,\n} from '../FeedbackResponseDialog';\n\nexport enum FeedbackRatings {\n  one = 1,\n  two = 2,\n  three = 3,\n  four = 4,\n  five = 5,\n}\n\n/**\n * @public\n */\nexport interface StarredRatingButtonsProps {\n  feedbackDialogResponses?: EntityFeedbackResponse[];\n  feedbackDialogTitle?: ReactNode;\n  requestResponse?: boolean;\n  requestResponseThreshold?: number;\n}\n\nexport const StarredRatingButtons = (props: StarredRatingButtonsProps) => {\n  const {\n    feedbackDialogResponses,\n    feedbackDialogTitle,\n    requestResponse = true,\n    requestResponseThreshold = FeedbackRatings.two,\n  } = props;\n  const errorApi = useApi(errorApiRef);\n  const feedbackApi = useApi(entityFeedbackApiRef);\n  const identityApi = useApi(identityApiRef);\n  const [rating, setRating] = useState<FeedbackRatings>();\n  const [openFeedbackDialog, setOpenFeedbackDialog] = useState(false);\n  const { entity, loading: loadingEntity } = useAsyncEntity();\n\n  const { loading: loadingFeedback } = useAsync(async () => {\n    // Wait until entity is loaded\n    if (!entity) {\n      return;\n    }\n\n    try {\n      const identity = await identityApi.getBackstageIdentity();\n      const prevFeedback = await feedbackApi.getRatings(\n        stringifyEntityRef(entity),\n      );\n\n      const prevRating = prevFeedback.find(\n        r => r.userRef === identity.userEntityRef,\n      )?.rating;\n      if (prevRating) {\n        setRating(parseInt(prevRating, 10));\n      }\n    } catch (e) {\n      errorApi.post(e as ErrorApiError);\n    }\n  }, [entity, feedbackApi, setRating]);\n\n  const [{ loading: savingFeedback }, saveFeedback] = useAsyncFn(\n    async (feedback: FeedbackRatings) => {\n      try {\n        await feedbackApi.recordRating(\n          stringifyEntityRef(entity!),\n          feedback.toString(),\n        );\n        setRating(feedback);\n      } catch (e) {\n        errorApi.post(e as ErrorApiError);\n      }\n    },\n    [entity, feedbackApi, setRating],\n  );\n\n  const applyRating = useCallback(\n    (feedback: FeedbackRatings) => {\n      // Ignore rating if feedback is same as current\n      if (feedback === rating) {\n        return;\n      }\n\n      saveFeedback(feedback);\n      if (feedback <= requestResponseThreshold && requestResponse) {\n        setOpenFeedbackDialog(true);\n      }\n    },\n    [\n      rating,\n      requestResponse,\n      requestResponseThreshold,\n      saveFeedback,\n      setOpenFeedbackDialog,\n    ],\n  );\n\n  if (loadingEntity || loadingFeedback || savingFeedback) {\n    return <Progress />;\n  }\n\n  return (\n    <>\n      {Object.values(FeedbackRatings)\n        .filter((o): o is number => typeof o === 'number')\n        .map(starRating => (\n          <IconButton\n            key={starRating}\n            data-testid={`entity-feedback-star-button-${starRating}`}\n            onClick={() => applyRating(starRating as FeedbackRatings)}\n          >\n            {rating && rating >= starRating ? (\n              <StarIcon fontSize=\"small\" />\n            ) : (\n              <StarOutlineIcon fontSize=\"small\" />\n            )}\n          </IconButton>\n        ))}\n      <FeedbackResponseDialog\n        entity={entity!}\n        open={openFeedbackDialog}\n        onClose={() => setOpenFeedbackDialog(false)}\n        feedbackDialogResponses={feedbackDialogResponses}\n        feedbackDialogTitle={feedbackDialogTitle}\n      />\n    </>\n  );\n};\n"],"names":["FeedbackRatings"],"mappings":"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"}