commas in descriptions (#82)

* #67 Result highlights are returned in an array and should be concatenated
* Lock react-icons version (some Go actions are not available anymore on latest version)
* Fix updated linter rules (import/order)

package.json

@@ -13,13 +13,13 @@
     "react-bootstrap": "^2.1.1",
     "react-dom": "^17.0.2",
     "react-helmet": "^6.1.0",
-    "react-icons": "^4.3.1",
+    "react-icons": "4.3.1",
     "react-image": "^4.0.3",
     "react-router-dom": "^6.2.1",
     "react-syntax-highlighter": "^15.5.0",
+    "rollup-plugin-visualizer": "^5.8.3",
     "spdx-license-ids": "^3.0.11",
     "vite": "^4.5.3",
-    "rollup-plugin-visualizer": "^5.8.3",
     "web-vitals": "^2.1.3"
   },
   "scripts": {

src/components/Buckets.tsx

@@ -5,10 +5,10 @@ import Table from 'react-bootstrap/Table';
 import { Helmet } from 'react-helmet';
 import { Link } from 'react-router-dom';
 
-import BucketsResultsJson from '../serialization/BucketsResultsJson';
-import Utils from '../utils';
 import BucketTypeIcon from './BucketTypeIcon';
 import SearchStatus, { SearchStatusType } from './SearchStatus';
+import BucketsResultsJson from '../serialization/BucketsResultsJson';
+import Utils from '../utils';
 
 type Bucket = {
   bucket: string;

src/components/Home.tsx

@@ -8,9 +8,9 @@ import powershell from 'react-syntax-highlighter/dist/esm/languages/prism/powers
 import darkStyle from 'react-syntax-highlighter/dist/esm/styles/prism/a11y-dark';
 import lightStyle from 'react-syntax-highlighter/dist/esm/styles/prism/ghcolors';
 
-import { ColorSchemeContext } from '../colorscheme/ColorSchemeContext';
 import AsciinemaCasts, { AsciinemaCastItem } from './AsciinemaCasts';
 import SearchBar from './SearchBar';
+import { ColorSchemeContext } from '../colorscheme/ColorSchemeContext';
 
 SyntaxHighlighterBase.registerLanguage('powershell', powershell);
 SyntaxHighlighterBase.registerLanguage('json', json);

src/components/Root.tsx

@@ -1,9 +1,9 @@
 import { IconContext } from 'react-icons';
 import { Outlet } from 'react-router-dom';
 
-import ColorSchemeProvider from '../colorscheme/ColorSchemeProvider';
 import Footer from './Footer';
 import NavBar from './NavBar';
+import ColorSchemeProvider from '../colorscheme/ColorSchemeProvider';
 
 const Root = (): JSX.Element => {
   return (

src/components/Search.tsx

@@ -4,13 +4,13 @@ import { Container, Row, Col, Modal } from 'react-bootstrap';
 import { Helmet } from 'react-helmet';
 import { useSearchParams } from 'react-router-dom';
 
-import { requestIdleCallback } from '../request-idle-callback';
-import ManifestJson from '../serialization/ManifestJson';
-import SearchResultsJson from '../serialization/SearchResultsJson';
 import SearchBar from './SearchBar';
 import SearchPagination from './SearchPagination';
 import SearchProcessor, { SortDirection, sortModes } from './SearchProcessor';
 import SearchResult from './SearchResult';
+import { requestIdleCallback } from '../request-idle-callback';
+import ManifestJson from '../serialization/ManifestJson';
+import SearchResultsJson from '../serialization/SearchResultsJson';
 
 const RESULTS_PER_PAGE = 20;
 const SEARCH_PARAM_QUERY = 'q';

src/components/SearchProcessor.tsx

@@ -5,9 +5,9 @@ import { IconBaseProps } from 'react-icons';
 import { FaSortAmountDown, FaSortAmountUp } from 'react-icons/fa';
 import { GoSettings } from 'react-icons/go';
 
-import SearchResultsJson from '../serialization/SearchResultsJson';
 import BucketTypeIcon from './BucketTypeIcon';
 import SearchStatus, { SearchStatusType } from './SearchStatus';
+import SearchResultsJson from '../serialization/SearchResultsJson';
 
 export enum SortDirection {
   Ascending,

src/components/SearchResult.tsx

@@ -9,10 +9,10 @@ import { Img } from 'react-image';
 import deprecatedSpdxLicenses from 'spdx-license-ids/deprecated.json';
 import supportedSpdxLicenses from 'spdx-license-ids/index.json';
 
-import ManifestJson from '../serialization/ManifestJson';
-import Utils from '../utils';
 import BucketTypeIcon from './BucketTypeIcon';
 import CopyToClipboardButton from './CopyToClipboardButton';
+import ManifestJson from '../serialization/ManifestJson';
+import Utils from '../utils';
 
 const spdxLicenses = supportedSpdxLicenses.concat(deprecatedSpdxLicenses);
 

src/serialization/ManifestJson.ts

@@ -4,7 +4,7 @@ import MetadataJson from './MetadataJson';
 
 type HighLight = string | undefined;
 
-type HighLights = { [propertyName: string]: string } | undefined;
+type HighLights = { [propertyName: string]: string[] } | undefined;
 
 @JsonObject('ManifestJson')
 class ManifestJson {
@@ -81,7 +81,7 @@ class ManifestJson {
       return this.highlights && this.highlights[value];
     });
 
-    return match && this.highlights ? this.highlights[match] : fallback;
+    return match && this.highlights ? this.highlights[match].join(' ') : fallback;
   }
 }