Change: Show subject first in TLS certificate list, show both DNs in details

package.json

@@ -13,7 +13,7 @@
     "type": "git",
     "url": "https://github.com/greenbone/gsa/"
   },
-  "author": "Bj\u00f6rn Ricks <[email protected]>",
+  "author": "Björn Ricks <[email protected]>",
   "license": "AGPL-3.0+",
   "main": "src/index.js",
   "engines": {
@@ -123,4 +123,4 @@
       "git add"
     ]
   }
-}
+}

src/gmp/models/__tests__/tlscertificate.js

@@ -37,17 +37,18 @@ describe('TlsCertificate Model tests', () => {
     expect(tlsCertificate2.certificate).toBeUndefined();
   });
 
-  test('should parse issuer_dn as name', () => {
+  test('should parse issuer_dn and subject_dn', () => {
     const element = {
       certificate: {
         __text: 'CERT123',
       },
-      issuer_dn: 'dn',
+      issuer_dn: 'CN=issuer',
+      subject_dn: 'CN=subject',
     };
     const tlsCertificate = TlsCertificate.fromElement(element);
 
-    expect(tlsCertificate.name).toEqual('dn');
-    expect(tlsCertificate.issuer_dn).toBeUndefined();
+    expect(tlsCertificate.issuer_dn).toEqual('CN=issuer');
+    expect(tlsCertificate.subject_dn).toEqual('CN=subject');
   });
 
   test('should parse activation_time', () => {

src/gmp/models/tlscertificate.js

@@ -51,8 +51,8 @@ class TlsCertificate extends Model {
       ? element.certificate.__text
       : undefined;
 
-    ret.name = element.issuer_dn;
-    delete ret.issuer_dn;
+    // Use subject DN as name
+    ret.name = ret.subject_dn;
 
     ret.activationTime =
       element.activation_time === 'undefined' ||

src/web/pages/tlscertificates/__tests__/detailspage.js

@@ -49,7 +49,8 @@ const tlsCertificate = TlsCertificate.fromElement({
     __text: 'abcdefg12345',
     _format: 'DER',
   },
-  issuer_dn: 'CN=LoremIpsum C=Dolor',
+  issuer_dn: 'CN=LoremIpsumIssuer C=Dolor',
+  subject_dn: 'CN=LoremIpsumSubject C=Dolor',
   activation_time: '2019-08-10T12:51:27Z',
   creation_time: '2019-07-10T12:51:27Z',
   expiration_time: '2019-09-10T12:51:27Z',
@@ -114,7 +115,9 @@ describe('TLS Certificate Detailspage tests', () => {
       <Detailspage id="1234" />,
     );
 
-    expect(element).toHaveTextContent('TLS Certificate: CN=LoremIpsum C=Dolor');
+    expect(element).toHaveTextContent(
+      'TLS Certificate: CN=LoremIpsumSubject C=Dolor',
+    );
 
     const links = baseElement.querySelectorAll('a');
     const icons = getAllByTestId('svg-icon');
@@ -133,7 +136,8 @@ describe('TLS Certificate Detailspage tests', () => {
     expect(element).toHaveTextContent('Tue, Dec 10, 2019 12:51 PM UTC');
     expect(element).toHaveTextContent('admin');
 
-    expect(element).toHaveTextContent('NameCN=LoremIpsum C=Dolor');
+    expect(element).toHaveTextContent('Subject DNCN=LoremIpsumSubject C=Dolor');
+    expect(element).toHaveTextContent('Issuer DNCN=LoremIpsumIssuer C=Dolor');
     expect(element).toHaveTextContent('ValidNo');
     expect(element).toHaveTextContent(
       'ActivatesSat, Aug 10, 2019 12:51 PM UTC',

src/web/pages/tlscertificates/__tests__/listpage.js

@@ -45,7 +45,8 @@ const tlsCertificate = TlsCertificate.fromElement({
     __text: 'abcdefg12345',
     _format: 'DER',
   },
-  issuer_dn: 'CN=LoremIpsum C=Dolor',
+  issuer_dn: 'CN=LoremIpsumIssuer C=Dolor',
+  subject_dn: 'CN=LoremIpsumSubject C=Dolor',
   activation_time: '2019-08-10T12:51:27Z',
   expiration_time: '2019-09-10T12:51:27Z',
   last_seen: '2019-10-10T12:51:27Z',
@@ -192,7 +193,7 @@ describe('TlsCertificatePage tests', () => {
     );
 
     // Table
-    expect(header[0]).toHaveTextContent('Issuer DN');
+    expect(header[0]).toHaveTextContent('Subject DN');
     expect(header[1]).toHaveTextContent('Serial');
     expect(header[2]).toHaveTextContent('Activates');
     expect(header[3]).toHaveTextContent('Expires');

src/web/pages/tlscertificates/__tests__/row.js

@@ -40,7 +40,8 @@ const tlsCertificate = TlsCertificate.fromElement({
     __text: 'abcdefg12345',
     _format: 'DER',
   },
-  issuer_dn: 'CN=LoremIpsum C=Dolor',
+  issuer_dn: 'CN=LoremIpsumIssuer C=Dolor',
+  subject_dn: 'CN=LoremIpsumSubject C=Dolor',
   activation_time: '2019-08-10T12:51:27Z',
   expiration_time: '2019-09-10T12:51:27Z',
   last_seen: '2019-10-10T12:51:27Z',
@@ -81,7 +82,7 @@ describe('Tls Certificate Row tests', () => {
     );
 
     // Info
-    expect(baseElement).toHaveTextContent('CN=LoremIpsum C=Dolor');
+    expect(baseElement).toHaveTextContent('CN=LoremIpsumSubject C=Dolor');
     expect(baseElement).toHaveTextContent('123');
     expect(baseElement).toHaveTextContent('Sat, Aug 10, 2019 12:51 PM UTC');
     expect(baseElement).toHaveTextContent('Tue, Sep 10, 2019 12:51 PM UTC');

src/web/pages/tlscertificates/__tests__/table.js

@@ -42,7 +42,8 @@ const tlsCertificate = TlsCertificate.fromElement({
     __text: 'abcdefg12345',
     _format: 'DER',
   },
-  issuer_dn: 'CN=LoremIpsum C=Dolor',
+  issuer_dn: 'CN=LoremIpsumIssuer C=Dolor',
+  subject_dn: 'CN=LoremIpsumSubject C=Dolor',
   activation_time: '2019-08-10T12:51:27Z',
   expiration_time: '2019-09-10T12:51:27Z',
   last_seen: '2019-10-10T12:51:27Z',
@@ -93,7 +94,7 @@ describe('TlsCertificates table tests', () => {
     );
 
     const header = baseElement.querySelectorAll('th');
-    expect(header[0]).toHaveTextContent('Issuer DN');
+    expect(header[0]).toHaveTextContent('Subject DN');
     expect(header[1]).toHaveTextContent('Serial');
     expect(header[2]).toHaveTextContent('Activates');
     expect(header[3]).toHaveTextContent('Expires');

src/web/pages/tlscertificates/details.js

@@ -53,6 +53,18 @@ const TlsCertificateDetails = ({entity, links = true}) => {
           <Col width="90%" />
         </colgroup>
         <TableBody>
+          {isDefined(entity.subject_dn) && (
+            <TableRow>
+              <TableData>{_('Subject DN')}</TableData>
+              <TableData>{entity.subject_dn}</TableData>
+            </TableRow>
+          )}
+          {isDefined(entity.issuer_dn) && (
+            <TableRow>
+              <TableData>{_('Issuer DN')}</TableData>
+              <TableData>{entity.issuer_dn}</TableData>
+            </TableRow>
+          )}
           {isDefined(entity.valid) && (
             <TableRow>
               <TableData>{_('Valid')}</TableData>
@@ -111,10 +123,7 @@ const mapDispatchToProps = (dispatch, {gmp}) => ({
 
 export default compose(
   withGmp,
-  connect(
-    mapStateToProps,
-    mapDispatchToProps,
-  ),
+  connect(mapStateToProps, mapDispatchToProps),
 )(TlsCertificateDetails);
 
 // vim: set ts=2 sw=2 tw=80:

src/web/pages/tlscertificates/filterdialog.js

@@ -21,7 +21,11 @@ import {createFilterDialog} from '../../components/powerfilter/dialog.js';
 
 const SORT_FIELDS = [
   {
-    name: 'name',
+    name: 'subject_dn',
+    displayName: _l('Subject DN'),
+  },
+  {
+    name: 'issuer_dn',
     displayName: _l('Issuer DN'),
   },
   {

src/web/pages/tlscertificates/row.js

@@ -93,7 +93,7 @@ const Row = ({
       <TableData>
         <span>
           <RowDetailsToggle name={entity.id} onClick={onToggleDetailsClick}>
-            <Div>{entity.name}</Div>
+            <Div>{entity.subject_dn}</Div>
           </RowDetailsToggle>
         </span>
       </TableData>

src/web/pages/tlscertificates/table.js

@@ -46,9 +46,9 @@ const Header = ({
           width="30%"
           currentSortDir={currentSortDir}
           currentSortBy={currentSortBy}
-          sortBy={sort ? 'issuer_dn' : false}
+          sortBy={sort ? 'subject_dn' : false}
           onSortChange={onSortChange}
-          title={_('Issuer DN')}
+          title={_('Subject DN')}
         />
         <TableHead
           width="26%"