From 8d24bae7e4eabada7e7578360b331279b8258bee Mon Sep 17 00:00:00 2001
From: Eric Gauzens <ericgauzens@hotmail.com>
Date: Wed, 20 Nov 2024 15:44:40 -0500
Subject: [PATCH] Added ability to view datasets published on GitHub

---
 .../DatasetDetails/DatasetActionBox.vue       |  8 ++++
 components/DatasetDetails/SourceCodeInfo.vue  | 40 +++++++++++++++++++
 pages/datasets/[datasetId].vue                | 20 ++++++++++
 static/js/license-util.js                     |  2 +-
 4 files changed, 69 insertions(+), 1 deletion(-)
 create mode 100644 components/DatasetDetails/SourceCodeInfo.vue

diff --git a/components/DatasetDetails/DatasetActionBox.vue b/components/DatasetDetails/DatasetActionBox.vue
index 7644bfa7..d7cf37ed 100644
--- a/components/DatasetDetails/DatasetActionBox.vue
+++ b/components/DatasetDetails/DatasetActionBox.vue
@@ -71,6 +71,11 @@
           Cite Dataset
         </el-button>
       </template>
+      <template v-if="hasSourceCode">
+        <el-button class="secondary" @click="actionButtonClicked('source')">
+          Open Source Code
+        </el-button>
+      </template>
       <template v-if="sdsViewer">
         <a
           :href="sdsViewer"
@@ -135,6 +140,9 @@ export default {
     hasFiles: function() {
       return this.fileCount >= 1
     },
+    hasSourceCode: function () {
+      return propOr(null, 'release', this.datasetInfo) !== null
+    },
     fileCount: function() {
       return propOr('0', 'fileCount', this.datasetInfo)
     },
diff --git a/components/DatasetDetails/SourceCodeInfo.vue b/components/DatasetDetails/SourceCodeInfo.vue
new file mode 100644
index 00000000..017ab204
--- /dev/null
+++ b/components/DatasetDetails/SourceCodeInfo.vue
@@ -0,0 +1,40 @@
+<template>
+  <div>
+    <div class="heading2 mb-8">
+      Repository
+    </div>
+    <div class="mb-16">
+      The design and code files for the device are stored in a public repository on GitHUB. Please feel free to clone the repository for your usage.
+    </div>
+    <div class="mb-16"><span class="label4">Repository Link: </span><a target="_blank" :href="repoLink">{{ repoLink }}</a></div>
+    <a
+      :href="repoLink"
+      target="_blank"
+    >
+      <el-button>
+        Visit Repository <svgo-icon-open class="icon-open" />
+      </el-button>
+    </a>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'SourceCodeInfo',
+  props: {
+    repoLink: {
+      type: String,
+      default: () => "",
+      required: true
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.icon-open {
+  height: 1.5rem;
+  width: 1.5rem;
+  margin-top: 2px;
+}
+</style>
diff --git a/pages/datasets/[datasetId].vue b/pages/datasets/[datasetId].vue
index 4eaa90e6..97079043 100644
--- a/pages/datasets/[datasetId].vue
+++ b/pages/datasets/[datasetId].vue
@@ -57,6 +57,7 @@
                   :associated-projects="associatedProjects" />
                 <citation-details class="body1" v-show="activeTabId === 'cite'" :doi-value="datasetInfo.doi" />
                 <dataset-files-info class="body1" v-if="hasFiles" v-show="activeTabId === 'files'" />
+                <source-code-info class="body1" v-if="hasSourceCode" v-show="activeTabId === 'source'" :repoLink="sourceCodeLink"/>
                 <images-gallery class="body1" :markdown="markdown.markdownTop" v-show="activeTabId === 'images'" />
                 <dataset-references v-if="hasCitations" class="body1" v-show="activeTabId === 'references'"
                   :primary-publications="primaryPublications" :associated-publications="associatedPublications" />
@@ -90,6 +91,7 @@ import DatasetDescriptionInfo from '@/components/DatasetDetails/DatasetDescripti
 import DatasetAboutInfo from '@/components/DatasetDetails/DatasetAboutInfo.vue'
 import CitationDetails from '@/components/CitationDetails/CitationDetails.vue'
 import DatasetFilesInfo from '@/components/DatasetDetails/DatasetFilesInfo.vue'
+import SourceCodeInfo from '@/components/DatasetDetails/SourceCodeInfo.vue'
 import ImagesGallery from '@/components/ImagesGallery/ImagesGallery.vue'
 import DatasetReferences from '~/components/DatasetDetails/DatasetReferences.vue'
 import VersionHistory from '@/components/VersionHistory/VersionHistory.vue'
@@ -210,6 +212,7 @@ export default {
     DatasetAboutInfo,
     CitationDetails,
     DatasetFilesInfo,
+    SourceCodeInfo,
     ImagesGallery,
     DatasetReferences,
     VersionHistory,
@@ -494,6 +497,12 @@ export default {
       let numAssociated = this.associatedPublications ? this.associatedPublications.length : 0;
       return numPrimary + numAssociated;
     },
+    hasSourceCode: function () {
+      return propOr(null, 'release', this.datasetInfo) !== null
+    },
+    sourceCodeLink: function () {
+      return pathOr(null, ['release','repoUrl'], this.datasetInfo)
+    },
     numDownloads: function () {
       let numDownloads = 0;
       this.downloadsSummary.filter(download => download.datasetId == this.datasetId).forEach(item => {
@@ -558,6 +567,17 @@ export default {
       },
       immediate: true
     },
+    hasSourceCode: {
+      handler: function (newValue) {
+        if (newValue && !this.hasError) {
+          const hasSourceCodeTab = this.tabs.find(tab => tab.id === 'source') !== undefined
+          if (!hasSourceCodeTab) {
+            this.tabs.splice(4, 0, { label: 'Source Code', id: 'source' })
+          }
+        }
+      },
+      immediate: true
+    },
     canViewVersions: {
       handler: function (newValue) {
         if (newValue && !this.hasError) {
diff --git a/static/js/license-util.js b/static/js/license-util.js
index ca65f50c..eb73b23e 100644
--- a/static/js/license-util.js
+++ b/static/js/license-util.js
@@ -68,7 +68,7 @@ const licenseData = [
   },
   {
     label: 'MIT license (MIT)',
-    value: 'MIT',
+    value: 'MIT License',
     abbr: 'MIT',
     link: 'https://opensource.org/licenses/MIT'
   },