diff --git a/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsText.js b/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsText.js
index 7a3dfb7..8b9cb6f 100644
--- a/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsText.js
+++ b/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsText.js
@@ -1,6 +1,6 @@
-import { useTranslation } from 'react-i18next';
+import ConcordanceDetailsTextInfo from './ConcordanceDetailsTextInfo';
 
-import sytles from './ConcordanceDetailsText.module.scss';
+import { useTranslation } from 'react-i18next';
 
 const ConcordanceDetailsText = (props) => {
     // Hooks
@@ -8,22 +8,10 @@ const ConcordanceDetailsText = (props) => {
 
     return (
         <>
-            <div className={sytles.textInfo}>
-                <h5>{t('concordance.detailsTextSource')}</h5>
-                <p>{props.source}</p>
-            </div>
-            <div className={sytles.textInfo}>
-                <h5>{t('concordance.detailsTextYear')}</h5>
-                <p>{props.year}</p>
-            </div>
-            <div className={sytles.textInfo}>
-                <h5>{t('concordance.detailsTextTitle')}</h5>
-                <p>{props.title}</p>
-            </div>
-            <div className={sytles.textInfo}>
-                <h5>{t('concordance.detailsTextAuthor')}</h5>
-                <p>{props.author}</p>
-            </div>
+            <ConcordanceDetailsTextInfo title={t('concordance.detailsTextSource')} value={props.source} />
+            <ConcordanceDetailsTextInfo title={t('concordance.detailsTextYear')} value={props.year} />
+            <ConcordanceDetailsTextInfo title={t('concordance.detailsTextTitle')} value={props.title} />
+            <ConcordanceDetailsTextInfo title={t('concordance.detailsTextAuthor')} value={props.author} />
         </>
     );
 };
diff --git a/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsTextInfo.js b/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsTextInfo.js
new file mode 100644
index 0000000..7a4a0a4
--- /dev/null
+++ b/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsTextInfo.js
@@ -0,0 +1,15 @@
+import styles from './ConcordanceDetailsTextInfo.module.scss';
+
+const ConcordanceDetailsTextInfo = (props) => {
+    var title = props.title;
+    var value = props.value;
+
+    if (value) {
+        return (<div className={styles.textInfo}>
+            <h5>{title}</h5>
+            <p>{value}</p>
+        </div>);
+    }
+};
+
+export default ConcordanceDetailsTextInfo;
\ No newline at end of file
diff --git a/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsText.module.scss b/src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsTextInfo.module.scss
similarity index 100%
rename from src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsText.module.scss
rename to src/apps/Rsdo.Concordancer.Api/WebApp/src/components/concordance/ConcordanceDetailsTextInfo.module.scss