Fix metadata section separators

tropy · Feb 8, 2019 · a4eca1f · a4eca1f
1 parent 82c2325
commit a4eca1f
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 9 deletions.
diff --git a/src/components/metadata/panel.js b/src/components/metadata/panel.js
@@ -200,6 +200,7 @@ class MetadataPanel extends React.PureComponent {
     return this.hasPhotoFields && (
       <MetadataSection
         onContextMenu={this.handlePhotoContextMenu}
+        separator
         title="panel.metadata.photo">
         <MetadataList
           ref={this.setPhotoFields}
@@ -223,6 +224,7 @@ class MetadataPanel extends React.PureComponent {
     return this.hasSelectionFields && (
       <MetadataSection
         onContextMenu={this.handleSelectionContextMenu}
+        separator
         title="panel.metadata.selection">
         <MetadataList
           ref={this.setSelectionFields}

diff --git a/src/components/metadata/section.js b/src/components/metadata/section.js
@@ -1,23 +1,26 @@
 'use strict'
 
 const React = require('react')
-const { func, node, number, string } = require('prop-types')
+const { bool, func, node, number, string } = require('prop-types')
 const { FormattedMessage } = require('react-intl')
+const cx = require('classnames')
 
 
-const MetadataSection = ({ children, count, onContextMenu, title }) => (
-  <section onContextMenu={onContextMenu}>
-    <h5 className="metadata-heading">
-      <FormattedMessage id={title} values={{ count }}/>
-    </h5>
-    {children}
-  </section>
-)
+const MetadataSection =
+  ({ children, count, onContextMenu, separator, title }) => (
+    <section onContextMenu={onContextMenu}>
+      <h5 className={cx('metadata-heading', { separator })}>
+        <FormattedMessage id={title} values={{ count }}/>
+      </h5>
+      {children}
+    </section>
+  )
 
 MetadataSection.propTypes = {
   children: node.isRequired,
   count: number,
   onContextMenu: func,
+  separator: bool,
   title: string.isRequired
 }