diff --git a/src/components/ResourceItemInfo.vue b/src/components/ResourceItemInfo.vue
index 6b9abf9e..487bee93 100644
--- a/src/components/ResourceItemInfo.vue
+++ b/src/components/ResourceItemInfo.vue
@@ -5,14 +5,15 @@
       &nbsp;&nbsp;<badges :badges="resourceItem.badges"></badges>
     </section>
     <section>
-      <pre class="resource-id">🆔</pre>
-      <pre ref="resourceId" class="resource-id">{{ resourceItem.id }}</pre>
-
-      <b-button
-        size="is-small"
-        icon-left="content-copy"
-        @click="copyText(resourceItem.id)"
-      ></b-button>
+      <template v-if="resourceItem.id !== resourceItem.nickname">
+        <pre class="resource-id">🆔</pre>
+        <pre ref="resourceId" class="resource-id">{{ resourceItem.id }}</pre>
+        <b-button
+          size="is-small"
+          icon-left="content-copy"
+          @click="copyText(resourceItem.id)"
+        ></b-button>
+      </template>
 
       <pre
         style="margin-left: 20px;"
diff --git a/src/store.js b/src/store.js
index dbc5fb89..7831eb00 100644
--- a/src/store.js
+++ b/src/store.js
@@ -162,6 +162,8 @@ export const store = new Vuex.Store({
       state.resourceItems = state.resourceItems.map(item => {
         // make sure the id and links are in lowercase
         item.id = item.id || randId();
+        // use the id as the nickname if not provided
+        item.nickname = item.nickname || item.id;
         item.id = item.id.toLowerCase();
         item.links = item.links || [];
         item.tags = item.tags || [];