Merge branch 'master' into dependabot/npm_and_yarn/url-parse-1.5.10

.github/workflows/test.yml

@@ -0,0 +1,29 @@
+name: Run tests
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+
+permissions:
+  contents: read
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4.1.1
+
+      - uses: actions/setup-node@v4.0.1
+        with:
+          node-version: 10
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests
+        run: npm test

azure-pipelines.yml

@@ -4,7 +4,7 @@
 # https://docs.microsoft.com/azure/devops/pipelines/languages/javascript
 
 pool:
-  vmImage: 'ubuntu-18.04'
+  vmImage: 'ubuntu-20.04'
 
 steps:
   - task: NodeTool@0

src/actions/definitionActions.js

@@ -56,7 +56,7 @@ export function checkForMissingDefinition(token, isFirstAttempt = false) {
     ).filter(x => x)
     const missingDefinitions = map(
       workspaceComponents,
-      item => !get(item, 'described.tools') && EntitySpec.fromObject(item).toPath()
+      item => !get(item, 'described.tools') && EntitySpec.fromObject(item.coordinates).toPath()
     ).filter(x => x)
     if (missingDefinitions.length > 0) {
       if (isFirstAttempt)

src/api/clearlyDefined.js

@@ -23,6 +23,7 @@ export const ORIGINS_PYPI = 'origins/pypi'
 export const ORIGINS_RUBYGEMS = 'origins/rubygems'
 export const ORIGINS_DEBIAN = 'origins/deb'
 export const ORIGINS_COMPOSER = 'origins/composer'
+export const ORIGINS_POD = 'origins/pod'
 export const ORIGINS = {
   github: { git: ORIGINS_GITHUB },
   npmjs: { npm: ORIGINS_NPM },
@@ -32,7 +33,8 @@ export const ORIGINS = {
   pypi: { pypi: ORIGINS_PYPI },
   rubygems: { gem: ORIGINS_RUBYGEMS },
   debian: { deb: ORIGINS_DEBIAN, debsrc: ORIGINS_DEBIAN },
-  packagist: { composer: ORIGINS_COMPOSER }
+  packagist: { composer: ORIGINS_COMPOSER },
+  cocoapods: { pod: ORIGINS_POD }
 }
 
 export function getHarvestResults(token, entity) {
@@ -218,6 +220,14 @@ export function getComposerRevisions(token, path) {
   return get(url(`${ORIGINS_COMPOSER}/${path}/revisions`), token)
 }
 
+export function getCocoaPodsSearch(token, path) {
+  return get(url(`${ORIGINS_POD}/${path}`), token)
+}
+
+export function getCocoaPodsRevisions(token, path) {
+  return get(url(`${ORIGINS_POD}/${path}/revisions`), token)
+}
+
 export function getRevisions(token, path, type, provider) {
   const origin = _.get(ORIGINS, `${provider}.${type}`)
   return get(url(`${origin}/${path}/revisions`), token)

src/components/ComponentList.js

@@ -145,8 +145,9 @@ class ComponentList extends React.Component {
   render() {
     const { loadMoreRows, noRowsRenderer, list, listLength } = this.props
     const { sortOrder, contentSeq } = this.state
+    const showFilterBar = false
     return (
-      <div className="clearly-table-body flex-grow">
+      <div className={`clearly-table-body flex-grow ${showFilterBar ? 'show-filter' : ''}`}>
         <div className="clearly-header">
           <div className="table-header-fcloumn">
             <h4>Component</h4>

src/components/DefinitionEntry.js

@@ -3,7 +3,7 @@
 
 import React from 'react'
 import PropTypes from 'prop-types'
-import { TwoLineEntry, QuickEditModel, SourcePicker, FileCountRenderer } from './'
+import { TwoLineEntry, QuickEditModel, FileCountRenderer } from './'
 import { Checkbox, OverlayTrigger, Tooltip, Popover } from 'react-bootstrap'
 import { Tag } from 'antd'
 import { get, isEqual, union } from 'lodash'
@@ -16,6 +16,7 @@ import nuget from '../images/nuget.svg'
 import debian from '../images/debian.png'
 import maven from '../images/maven.png'
 import composer from '../images/packagist.png'
+import pod from '../images/pod.png'
 import Contribution from '../utils/contribution'
 import Definition from '../utils/definition'
 import Curation from '../utils/curation'
@@ -33,7 +34,7 @@ class DefinitionEntry extends React.Component {
     }
   }
   static propTypes = {
-    onChange: PropTypes.func,
+    onChange: PropTypes.func.isRequired,
     onCurate: PropTypes.func,
     onInspect: PropTypes.func,
     activeFacets: PropTypes.array,
@@ -59,7 +60,7 @@ class DefinitionEntry extends React.Component {
       const newChanges = { ...component.changes }
       if (isChanged && proposedValue !== null) newChanges[field] = proposedValue
       else delete newChanges[field]
-      onChange && onChange(component, newChanges, field)
+      onChange(component, newChanges, field)
     }
   }
 
@@ -89,10 +90,10 @@ class DefinitionEntry extends React.Component {
         <ScoreRenderer scores={scores} definition={definition} />
       </span>
     ) : null
-    const releasedDate = definition?.described?.releaseDate ? (
-      <span className="releasedDate-table">{definition.described.releaseDate}</span>
-    ) : (
-      <span className="releasedDate-table">-- -- --</span>
+    const releasedDate = (
+      <span className="releasedDate-table">
+        {this.renderFieldWithToolTipIfDifferent('described.releaseDate', a => a || '-- -- --')}
+      </span>
     )
     const curationTag = isCurationPending ? (
       <span>
@@ -124,7 +125,7 @@ class DefinitionEntry extends React.Component {
   renderWithToolTipIfDifferent(field, content, placement = 'right', transform = x => x) {
     const toolTip = (
       <Tooltip id={`tooltip-${field}`} className="definition__tooltip">
-        Original: {transform(get(this.props.otherDefinition, field))}
+        Original: {transform(this.getOriginalValue(field))}
       </Tooltip>
     )
     return this.ifDifferent(
@@ -136,14 +137,19 @@ class DefinitionEntry extends React.Component {
     )
   }
 
+  renderFieldWithToolTipIfDifferent(field, transform = a => a) {
+    const displayValue = transform(this.getValue(field))
+    return this.renderWithToolTipIfDifferent(
+      field,
+      <span className={this.classIfDifferent(field)}>{displayValue}</span>,
+      undefined,
+      transform
+    )
+  }
+
   renderMessage(definition) {
     const licenseExpression = definition ? this.getValue('licensed.declared') : null
-    return licenseExpression
-      ? this.renderWithToolTipIfDifferent(
-        'licensed.declared',
-        <span className={this.classIfDifferent('licensed.declared')}>{licenseExpression}</span>
-      )
-      : null
+    return licenseExpression ? this.renderFieldWithToolTipIfDifferent('licensed.declared') : null
   }
 
   getPercentage(count, total) {
@@ -189,6 +195,23 @@ class DefinitionEntry extends React.Component {
     this.setState({ modelOpen: !this.state.modelOpen })
   }
 
+  handleSaveEdit = updates => {
+    const { onChange, definition, component } = this.props
+
+    const newChanges = Object.entries(updates).reduce((changes, [key, value]) => {
+      let field
+      if (key === 'declared') field = 'licensed.declared'
+      if (key === 'sourceComponent') field = 'described.sourceLocation'
+      if (key === 'release') field = 'described.releaseDate'
+      return field ? Contribution.applyChanges(definition, changes, field, value) : changes
+    }, {})
+
+    if (Object.keys(newChanges).length !== 0) {
+      const combinedChanges = { ...component.changes, ...newChanges }
+      onChange(component, combinedChanges)
+    }
+  }
+
   renderPanel(rawDefinition) {
     if (!rawDefinition)
       return (
@@ -200,13 +223,12 @@ class DefinitionEntry extends React.Component {
     // TODO: find a way of calling this method less frequently. It's relatively expensive.
     const definition = this.foldFacets(rawDefinition, this.props.activeFacets)
     const { licensed } = definition
-    const { readOnly, onRevert } = this.props
     return (
       <div className="row row-panel-details">
         <div className="col-md-6 d-flex justify-content-start align-items-center">
           <span className="panel-details__title">{this.renderLabel('Declared')}:</span>
           <div className="panel-details__value">
-            <p>{this.getValue('licensed.declared')}</p>
+            {this.renderFieldWithToolTipIfDifferent('licensed.declared')}
             {/* {this.renderWithToolTipIfDifferent(
               'licensed.declared',
               <LicensesRenderer
@@ -231,7 +253,7 @@ class DefinitionEntry extends React.Component {
         <div className="col-md-6 d-flex justify-content-start align-items-center">
           <span className="panel-details__title">{this.renderLabel('Source')}:</span>
           <div className="panel-details__value">
-            <p>{Contribution.printCoordinates(this.getValue('described.sourceLocation'))}</p>
+            {this.renderFieldWithToolTipIfDifferent('described.sourceLocation', a => Contribution.printCoordinates(a))}
             {/* {this.renderWithToolTipIfDifferent(
               'described.sourceLocation',
               <ModalEditor
@@ -262,7 +284,10 @@ class DefinitionEntry extends React.Component {
         <div className="col-md-6 d-flex justify-content-start align-items-center">
           <span className="panel-details__title">{this.renderLabel('Release')}:</span>
           <div className="panel-details__value">
-            <p>{Contribution.printDate(this.getValue('described.releaseDate'))}</p>
+            {this.renderFieldWithToolTipIfDifferent(
+              'described.releaseDate',
+              a => Contribution.printDate(a) || '-- -- --'
+            )}
             {/* {this.renderWithToolTipIfDifferent(
               'described.releaseDate',
               <InlineEditor
@@ -291,33 +316,12 @@ class DefinitionEntry extends React.Component {
           <QuickEditModel
             open={this.state.modelOpen}
             closeModel={this.handleModel}
-            definition={definition}
-            field={'described.sourceLocation'}
-            extraClass={this.classIfDifferent('described.sourceLocation')}
-            readOnly={readOnly}
-            initialValue={{
-              declared: this.getOriginalValue('licensed.declared'),
-              source: Contribution.printCoordinates(this.getOriginalValue('described.sourceLocation')),
-              release: Contribution.printDate(this.getOriginalValue('described.releaseDate')),
-              repo: ''
-            }}
-            values={{
+            initialValues={{
               declared: this.getValue('licensed.declared'),
-              source: Contribution.printCoordinates(this.getValue('described.sourceLocation')),
-              release: Contribution.printDate(this.getValue('described.releaseDate')),
-              repo: ''
-            }}
-            onChange={{
-              declared: this.fieldChange('licensed.declared'),
-              source: this.fieldChange('described.sourceLocation', isEqual, Contribution.toSourceLocation),
-              release: this.fieldChange('described.releaseDate'),
-              repo: ''
+              sourceComponent: this.getValue('described.sourceLocation'),
+              release: Contribution.printDate(this.getValue('described.releaseDate'))
             }}
-            editor={SourcePicker}
-            validator={value => true}
-            placeholder={'Source location'}
-            revertable
-            onRevert={() => onRevert('described.sourceLocation')}
+            onSave={this.handleSaveEdit}
           />
           <button onClick={this.handleModel} className="quick-edit-btn">
             Edit
@@ -425,6 +429,7 @@ class DefinitionEntry extends React.Component {
       <OverlayTrigger
         trigger="click"
         placement="left"
+        animation={false}
         rootClose
         overlay={
           <Popover title={title} id={title}>
@@ -455,6 +460,7 @@ class DefinitionEntry extends React.Component {
     if (definition.coordinates.type === 'nuget') return nuget
     if (definition.coordinates.type === 'deb') return debian
     if (definition.coordinates.type === 'composer') return composer
+    if (definition.coordinates.type === 'pod') return pod
     return null
   }
 

src/components/FileList/FileList.js

@@ -11,6 +11,8 @@ import FacetsDropdown from '../../components/FacetsDropdown'
 import Contribution from '../../utils/contribution'
 import FileListSpec from '../../utils/filelist'
 import Attachments from '../../utils/attachments'
+import ModalEditor from '../ModalEditor'
+import EnhancedLicensePicker from '../../utils/EnhancedLicensePicker'
 import folderIcon from '../../images/icons/folder.svg'
 import fileIcon from '../../images/icons/file.svg'
 import FolderOpenIcon from '@material-ui/icons/FolderOpen'
@@ -235,6 +237,16 @@ export default class FileList extends PureComponent {
     onChange(`described.facets.${facet}`, newGlobs)
   }
 
+  onLicenseChange = (record, license) => {
+    const { onChange, component, previewDefinition } = this.props
+    const attributions = Contribution.getValue(component.item, previewDefinition, `files[${record.id}].attributions`)
+    onChange(`files[${record.id}]`, license, null, license => ({
+      path: record.path,
+      license,
+      ...(attributions ? { attributions } : {})
+    }))
+  }
+
   onDirectorySelect = e => {
     let tempdata = this.state.breadcrumbs
     tempdata.push(e)
@@ -281,6 +293,25 @@ export default class FileList extends PureComponent {
     )
   }
 
+  renderLicenseCell = (value, record) => {
+    const { readOnly, component, previewDefinition } = this.props
+    const field = `files[${record.id}].license`
+    const editor = EnhancedLicensePicker
+    return (
+      !record.children && (
+        <ModalEditor
+          revertable={false}
+          field={field}
+          readOnly={readOnly}
+          initialValue={get(component.item, field)}
+          value={Contribution.getValue(component.item, previewDefinition, field)}
+          placeholder={'SPDX license'}
+          editor={editor}
+          onChange={license => this.onLicenseChange(record, license)} />
+      )
+    )
+  }
+
   render() {
     const { definition, component, previewDefinition } = this.props
     const { expandedRows, searchText, filteredFiles, files } = this.state
@@ -359,14 +390,8 @@ export default class FileList extends PureComponent {
         //       }}
         //     />
         //   ),
-        render: (value, record) => {
-          let license = Contribution.getValue(component.item, previewDefinition, `files[${record.id}].license`)
-          return (
-            !record.children &&
-            (license ? <p className="text-black">{license}</p> : <p className="text-gray">SPDX license</p>)
-          )
-        },
-        width: '15%'
+        render: this.renderLicenseCell,
+        width: '20%'
       },
       {
         title: 'Copyrights',
@@ -376,31 +401,6 @@ export default class FileList extends PureComponent {
         // ...this.getColumnSearchProps('attributions'),
         render: (value, record) => this.renderCopyrightCell(record, component, previewDefinition),
         width: '25%'
-      },
-      {
-        title: '',
-        dataIndex: 'edit',
-        key: 'edit',
-        className: 'edit-data',
-        // ...this.getColumnSearchProps('attributions'),
-        render: (value, record) =>
-          !record.children && (
-            <svg
-              className="edit-icon"
-              width="24"
-              height="24"
-              viewBox="0 0 24 24"
-              fill="none"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path d="M22.5 19.5H1.5V21H22.5V19.5Z" fill="#383A43" />
-              <path
-                d="M19.05 6.75C19.65 6.15 19.65 5.25 19.05 4.65L16.35 1.95C15.75 1.35 14.85 1.35 14.25 1.95L3 13.2V18H7.8L19.05 6.75ZM15.3 3L18 5.7L15.75 7.95L13.05 5.25L15.3 3ZM4.5 16.5V13.8L12 6.3L14.7 9L7.2 16.5H4.5Z"
-                fill="#383A43"
-              />
-            </svg>
-          ),
-        width: '5%'
       }
     ]