[frontend] Replace deprecated xlink:href with href in svg use elements

cloudera · Nov 1, 2023 · af6f4a6 · af6f4a6
1 parent 1bd53ae
commit af6f4a6
Show file tree

Hide file tree

Showing 31 changed files with 133 additions and 133 deletions.
diff --git a/apps/filebrowser/src/filebrowser/templates/fb_components.mako b/apps/filebrowser/src/filebrowser/templates/fb_components.mako
@@ -43,25 +43,25 @@ else:
         %elif path.lower().find('gs://') == 0:
           <li style="padding-top: 12px">
             <span class="breadcrumb-link homeLink">
-              <svg class="hi"><use xlink:href='#hi-gs'></use></svg>
+              <svg class="hi"><use href='#hi-gs'></use></svg>
             </span>
           </li>
         %elif path.lower().find('adl:/') == 0:
           <li style="padding-top: 12px">
             <span class="breadcrumb-link homeLink">
-              <svg class="hi"><use xlink:href='#hi-adls'></use></svg>
+              <svg class="hi"><use href='#hi-adls'></use></svg>
             </span>
           </li>
         %elif path.lower().find('abfs://') == 0:
           <li style="padding-top: 12px">
             <span class="breadcrumb-link homeLink">
-              <svg class="hi"><use xlink:href='#hi-adls'></use></svg>
+              <svg class="hi"><use href='#hi-adls'></use></svg>
             </span>
           </li>
         %elif path.lower().find('ofs://') == 0:
           <li style="padding-top: 12px">
             <span class="breadcrumb-link homeLink">
-              <svg class="hi"><use xlink:href='#hi-ofs'></use></svg>
+              <svg class="hi"><use href='#hi-ofs'></use></svg>
             </span>
           </li>
         %else:

diff --git a/apps/jobbrowser/src/jobbrowser/static/jobbrowser/js/impala_dagre.js b/apps/jobbrowser/src/jobbrowser/static/jobbrowser/js/impala_dagre.js
@@ -245,7 +245,7 @@ function impalaDagre(id) {
   function getIcon(icon) {
     var html = '';
     if (icon && icon.svg) {
-      html += '<svg class="hi"><use xlink:href="#'+ icon.svg +'"></use></svg>'
+      html += '<svg class="hi"><use href="#'+ icon.svg +'"></use></svg>'
     } else if (icon && icon.font) {
       html += "<div class='fa fa-fw valign-middle " + icon.font + "'></div>";
     }
@@ -507,7 +507,7 @@ function impalaDagre(id) {
     if (topNodes && topNodes.length) {
       var cpuTimelineSection = detailsContent.append('div').classed('details-section', true);
       var cpuTimelineTitle = cpuTimelineSection.append('header');
-      cpuTimelineTitle.append('svg').classed('hi', true).append('use').attr('xlink:href', '#hi-filter');
+      cpuTimelineTitle.append('svg').classed('hi', true).append('use').attr('href', '#hi-filter');
       var metricsMax = getMetricsMax() ? ' (' + ko.bindingHandlers.numberFormat.human(getMetricsMax(), 5) + ')' : '';
       cpuTimelineTitle.append('h5').text(window.I18n('Top Nodes') + metricsMax);
       var cpuTimelineSectionTable = cpuTimelineSection.append('table').classed('clickable ncolumn', true);
@@ -547,7 +547,7 @@ function impalaDagre(id) {
       var executionSum = sum(data, 'duration');
       var cpuTimelineSection = detailsContent.append('div').classed('details-section', true);
       var cpuTimelineTitle = cpuTimelineSection.append('header');
-      cpuTimelineTitle.append('svg').classed('hi', true).append('use').attr('xlink:href', icon);
+      cpuTimelineTitle.append('svg').classed('hi', true).append('use').attr('href', icon);
       cpuTimelineTitle.append('h5').text(title + ' (' + ko.bindingHandlers.numberFormat.human(executionSum, 5) + ')');
       cpuTimelineSection.node().appendChild($.parseXML(timeline).children[0]);
 
@@ -581,7 +581,7 @@ function impalaDagre(id) {
       var timelineSum = sum(timelineData, 'duration');
       var timelineSection = detailsContent.append('div').classed('details-section', true);
       var timelineTitle = timelineSection.append('header');
-      timelineTitle.append('svg').classed('hi', true).append('use').attr('xlink:href', '#hi-access-time');
+      timelineTitle.append('svg').classed('hi', true).append('use').attr('href', '#hi-access-time');
       timelineTitle.append('h5').text(window.I18n('Timeline') + ' (' + ko.bindingHandlers.numberFormat.human(timelineSum, 5) + ')');
       timelineSection.node().appendChild($.parseXML(timeline).children[0]);
 
@@ -599,7 +599,7 @@ function impalaDagre(id) {
     var metricsChildSections = metricsSection.selectAll('div').data(Object.keys(data.children));
 
     var metricsTitle = metricsSection.append('header');
-    metricsTitle.append('svg').classed('hi', true).append('use').attr('xlink:href', '#hi-bar-chart');
+    metricsTitle.append('svg').classed('hi', true).append('use').attr('href', '#hi-bar-chart');
     metricsTitle.append('h5').text(window.I18n('Metrics'));
 
     var metricsContent = metricsSection.append('table').classed('column metrics', true);

diff --git a/apps/oozie/src/oozie/templates/editor2/bundle_editor.mako b/apps/oozie/src/oozie/templates/editor2/bundle_editor.mako
@@ -65,7 +65,7 @@ ${ commonheader(_("Bundle Editor"), "Oozie", user, request) | n,unicode }
         %if is_embeddable:
           <li>
             <a href="javascript: void(0)" data-bind="publish: { 'assist.show.documents': 'oozie-bundle2' }">
-              <svg class="hi hi-fw hi-bigger"><use xlink:href="#hi-documents"></use></svg> ${ _('Bundles') }
+              <svg class="hi hi-fw hi-bigger"><use href="#hi-documents"></use></svg> ${ _('Bundles') }
             </a>
           </li>
         %endif

diff --git a/apps/oozie/src/oozie/templates/editor2/coordinator_editor.mako b/apps/oozie/src/oozie/templates/editor2/coordinator_editor.mako
@@ -67,7 +67,7 @@ ${ commonheader(_("Coordinator Editor"), "Oozie", user, request) | n,unicode }
         %if is_embeddable:
           <li>
             <a href="javascript: void(0)" data-bind="publish: { 'assist.show.documents': 'oozie-coordinator2' }">
-              <svg class="hi hi-fw hi-bigger"><use xlink:href="#hi-documents"></use></svg> ${ _('Schedules') }
+              <svg class="hi hi-fw hi-bigger"><use href="#hi-documents"></use></svg> ${ _('Schedules') }
             </a>
           </li>
         %endif

diff --git a/apps/oozie/src/oozie/templates/editor2/workflow_editor.mako b/apps/oozie/src/oozie/templates/editor2/workflow_editor.mako
@@ -70,7 +70,7 @@ ${ commonheader(_("Workflow Editor"), "Oozie", user, request, "40px") | n,unicod
         %if is_embeddable:
           <li>
             <a href="javascript: void(0)" data-bind="publish: { 'assist.show.documents': 'oozie-workflow2' }">
-              <svg class="hi hi-fw hi-bigger"><use xlink:href="#hi-documents"></use></svg> ${ _('Workflows') }
+              <svg class="hi hi-fw hi-bigger"><use href="#hi-documents"></use></svg> ${ _('Workflows') }
             </a>
           </li>
         %endif

diff --git a/apps/oozie/src/oozie/templates/navigation-bar.mako b/apps/oozie/src/oozie/templates/navigation-bar.mako
@@ -79,7 +79,7 @@
                 </a>
                 % else:
                 <a title="${ _('Switch to the dashboard') }" href="${ is_embeddable and '/hue/jobbrowser/#!workflows' or getURL(section, dashboard, ENABLE_V2.get())}">
-                  <svg class="svg-app-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#hi-oozie"></use></svg> ${ _('Oozie Editor') }
+                  <svg class="svg-app-icon"><use href="#hi-oozie"></use></svg> ${ _('Oozie Editor') }
                   <!-- ko component: { name: 'hue-favorite-app', params: { app: 'scheduler', interpreter: '${ getInterpreter(section) }' }} --><!-- /ko -->
                 </a>
                 % endif

diff --git a/desktop/core/src/desktop/js/components/HueIcon.vue b/desktop/core/src/desktop/js/components/HueIcon.vue
@@ -18,7 +18,7 @@
 
 <template>
   <svg class="hue-icon">
-    <use :xlink:href="xlinkAttr" />
+    <use :href="xlinkAttr" />
   </svg>
 </template>
 

diff --git a/desktop/core/src/desktop/js/components/__snapshots__/HueIcon.test.ts.snap b/desktop/core/src/desktop/js/components/__snapshots__/HueIcon.test.ts.snap
@@ -5,7 +5,7 @@ exports[`HueIcon.vue should render 1`] = `
   class="hue-icon"
 >
   <use
-    xlink:href="#hi-some-icon"
+    href="#hi-some-icon"
   />
 </svg>
 `;
diff --git a/desktop/core/src/desktop/js/components/icons/vue/ChevronLeftIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/ChevronLeftIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'ChevronLeftIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueChevronLeftSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueChevronLeftSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/ColumnIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/ColumnIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'ColumnIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueColumnSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueColumnSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/ConnectorIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/ConnectorIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'ConnectorIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueConnectorSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueConnectorSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/DatabaseIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/DatabaseIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'DatabaseIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueDatabaseSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueDatabaseSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/DropDownIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/DropDownIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'DropDownIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueDropDownSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueDropDownSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/DropRightIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/DropRightIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'DropRightIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueDropRightSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueDropRightSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/SpinnerLargeIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/SpinnerLargeIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'SpinnerLargeIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueSpinnerLargeSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueSpinnerLargeSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/SpinnerSmallIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/SpinnerSmallIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'SpinnerSmallIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueSpinnerSmallSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueSpinnerSmallSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/TableIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/TableIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'TableIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueTableSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueTableSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/icons/vue/ViewIcon.ts b/desktop/core/src/desktop/js/components/icons/vue/ViewIcon.ts
@@ -2,5 +2,5 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'ViewIcon',
-  template: '<svg class="hi hi-fw"><use xlink:href="#hueViewSymbol" /></svg>'
+  template: '<svg class="hi hi-fw"><use href="#hueViewSymbol" /></svg>'
 });
diff --git a/desktop/core/src/desktop/js/components/sidebar/HueSidebar.vue b/desktop/core/src/desktop/js/components/sidebar/HueSidebar.vue
@@ -76,54 +76,54 @@
   }
 
   const APP_ICON_INDEX: { [name: string]: string } = {
-    abfs: `<svg class="hi hi-fw"><use xlink:href="#hi-adls"></use></svg>`,
-    adls: `<svg class="hi hi-fw"><use xlink:href="#hi-adls"></use></svg>`,
-    dashboard: `<svg class="hi hi-fw"><use xlink:href="#hi-dashboard"></use></svg>`,
-    'data-browser': `<svg class="hi hi-fw"><use xlink:href="#hi-data-browser"></use></svg>`,
+    abfs: `<svg class="hi hi-fw"><use href="#hi-adls"></use></svg>`,
+    adls: `<svg class="hi hi-fw"><use href="#hi-adls"></use></svg>`,
+    dashboard: `<svg class="hi hi-fw"><use href="#hi-dashboard"></use></svg>`,
+    'data-browser': `<svg class="hi hi-fw"><use href="#hi-data-browser"></use></svg>`,
     default: `<i class="fa fa-fw fa-database"></i>`,
     'dist-cp': `<i class="fa fa-fw fa-files-o"></i>`,
-    documents: `<svg class="hi hi-fw"><use xlink:href="#hi-documents"></use></svg>`,
-    editor: `<svg class="hi hi-fw"><use xlink:href="#hi-editor"></use></svg>`,
+    documents: `<svg class="hi hi-fw"><use href="#hi-documents"></use></svg>`,
+    editor: `<svg class="hi hi-fw"><use href="#hi-editor"></use></svg>`,
     hbase: `<i class="fa fa-fw fa-th-large"></i>`,
     hdfs: `<i class="fa fa-fw fa-files-o"></i>`,
-    hive: `<svg class="hi hi-fw"><use xlink:href="#hi-hive"></use></svg>`,
-    impala: `<svg class="hi hi-fw"><use xlink:href="#hi-impala"></use></svg>`,
+    hive: `<svg class="hi hi-fw"><use href="#hi-hive"></use></svg>`,
+    impala: `<svg class="hi hi-fw"><use href="#hi-impala"></use></svg>`,
     importer: `<i class="fa fa-fw fa-cloud-upload"></i>`,
     indexes: `<i class="fa fa-fw fa-search-plus"></i>`,
-    jar: `<svg class="hi hi-fw"><use xlink:href="#hi-spark"></use></svg>`,
+    jar: `<svg class="hi hi-fw"><use href="#hi-spark"></use></svg>`,
     java: `<i class="fa fa-fw fa-file-code-o"></i>`,
-    'job-designer': `<svg class="hi hi-fw"><use xlink:href="#hi-job-designer"></use></svg>`,
+    'job-designer': `<svg class="hi hi-fw"><use href="#hi-job-designer"></use></svg>`,
     kafka: `<i class="fa fa-fw fa-sitemap"></i>`,
     mapreduce: `<i class="fa fa-fw fa-file-archive-o"></i>`,
-    markdown: `<svg class="hi hi-fw"><use xlink:href="#hi-markdown"></use></svg>`,
-    notebook: `<svg class="hi hi-fw"><use xlink:href="#hi-file-notebook"></use></svg>`,
-    oozie: `<svg class="hi hi-fw"><use xlink:href="#hi-oozie"></use></svg>`,
-    'oozie-bundle': `<svg class="hi hi-fw"><use xlink:href="#hi-oozie-bundle"></use></svg>`,
-    'oozie-coordinator': `<svg class="hi hi-fw"><use xlink:href="#hi-oozie-coordinator"></use></svg>`,
-    'oozie-workflow': `<svg class="hi hi-fw"><use xlink:href="#hi-oozie-workflow"></use></svg>`,
-    ofs: `<svg class="hi hi-fw"><use xlink:href="#hi-ofs"></use></svg>`,
-    gs: `<svg class="hi hi-fw"><use xlink:href="#hi-gs"></use></svg>`,
-    pig: `<svg class="hi hi-fw"><use xlink:href="#hi-pig"></use></svg>`,
-    py: `<svg class="hi hi-fw"><use xlink:href="#hi-py"></use></svg>`,
-    pyspark: `<svg class="hi hi-fw"><use xlink:href="#hi-spark"></use></svg>`,
+    markdown: `<svg class="hi hi-fw"><use href="#hi-markdown"></use></svg>`,
+    notebook: `<svg class="hi hi-fw"><use href="#hi-file-notebook"></use></svg>`,
+    oozie: `<svg class="hi hi-fw"><use href="#hi-oozie"></use></svg>`,
+    'oozie-bundle': `<svg class="hi hi-fw"><use href="#hi-oozie-bundle"></use></svg>`,
+    'oozie-coordinator': `<svg class="hi hi-fw"><use href="#hi-oozie-coordinator"></use></svg>`,
+    'oozie-workflow': `<svg class="hi hi-fw"><use href="#hi-oozie-workflow"></use></svg>`,
+    ofs: `<svg class="hi hi-fw"><use href="#hi-ofs"></use></svg>`,
+    gs: `<svg class="hi hi-fw"><use href="#hi-gs"></use></svg>`,
+    pig: `<svg class="hi hi-fw"><use href="#hi-pig"></use></svg>`,
+    py: `<svg class="hi hi-fw"><use href="#hi-py"></use></svg>`,
+    pyspark: `<svg class="hi hi-fw"><use href="#hi-spark"></use></svg>`,
     queries: `<i class="fa fa-fw fa-tasks"></i>`,
-    r: `<svg class="hi hi-fw"><use xlink:href="#hi-r"></use></svg>`,
+    r: `<svg class="hi hi-fw"><use href="#hi-r"></use></svg>`,
     report: `<i class="fa fa-fw fa-area-chart"></i>`,
     s3: `<i class="fa fa-fw fa-cubes"></i>`,
-    scala: `<svg class="hi hi-fw"><use xlink:href="#hi-scala"></use></svg>`,
-    scheduler: `<svg class="hi hi-fw"><use xlink:href="#hi-oozie"></use></svg>`,
+    scala: `<svg class="hi hi-fw"><use href="#hi-scala"></use></svg>`,
+    scheduler: `<svg class="hi hi-fw"><use href="#hi-oozie"></use></svg>`,
     security: `<i class="fa fa-fw fa-lock"></i>`,
     shell: `<i class="fa fa-fw fa-terminal"></i>`,
     solr: `<i class="fa fa-fw fa-search-plus"></i>`,
-    spark2: `<svg class="hi hi-fw"><use xlink:href="#hi-spark"></use></svg>`,
-    spark: `<svg class="hi hi-fw"><use xlink:href="#hi-spark"></use></svg>`,
-    sqoop1: `<svg class="hi hi-fw"><use xlink:href="#hi-sqoop"></use></svg>`,
-    sqoop: `<svg class="hi hi-fw"><use xlink:href="#hi-sqoop"></use></svg>`,
-    support: `<svg class="hi hi-fw"><use xlink:href="#hi-support"></use></svg>`,
+    spark2: `<svg class="hi hi-fw"><use href="#hi-spark"></use></svg>`,
+    spark: `<svg class="hi hi-fw"><use href="#hi-spark"></use></svg>`,
+    sqoop1: `<svg class="hi hi-fw"><use href="#hi-sqoop"></use></svg>`,
+    sqoop: `<svg class="hi hi-fw"><use href="#hi-sqoop"></use></svg>`,
+    support: `<svg class="hi hi-fw"><use href="#hi-support"></use></svg>`,
     tables: `<i class="fa fa-fw fa-database"></i>`,
     text: `<i class="fa fa-fw fa-i-cursor"></i>`,
     warehouses: `<i class="altus-icon altus-adb-cluster" style="margin: 0 1px 0 3px"></i>`,
-    workflows: `<svg class="hi hi-fw"><use xlink:href="#hi-oozie"></use></svg>`,
+    workflows: `<svg class="hi hi-fw"><use href="#hi-oozie"></use></svg>`,
     yarn: `<i class="fa fa-fw fa-tasks"></i>`
   };
 

diff --git a/desktop/core/src/desktop/js/components/sidebar/Sidebar.vue b/desktop/core/src/desktop/js/components/sidebar/Sidebar.vue
@@ -39,7 +39,7 @@
     <div class="sidebar-header">
       <a href="javascript:void(0);" @click="$emit('header-click', $event)">
         <svg>
-          <use xlink:href="#hi-sidebar-logo" />
+          <use href="#hi-sidebar-logo" />
         </svg>
       </a>
     </div>

diff --git a/desktop/core/src/desktop/js/jquery/plugins/jquery.filechooser.js b/desktop/core/src/desktop/js/jquery/plugins/jquery.filechooser.js
@@ -350,7 +350,7 @@ Plugin.prototype.navigateTo = function (path) {
     //var filesysteminfo = self.options.filesysteminfo;
     const fs = _parent.options.filesysteminfo[_parent.options.fsSelected || 'hdfs'];
     const el = fs.icon.svg
-      ? '<svg class="hi"><use xlink:href="' + fs.icon.svg.home + '"></use></svg>'
+      ? '<svg class="hi"><use href="' + fs.icon.svg.home + '"></use></svg>'
       : '<i class="fa ' + fs.icon.home + '"></i> ' + fs.label.home;
     const _homelink = $('<a>')
       .addClass('nounderline')

diff --git a/desktop/core/src/desktop/js/ko/components/appSwitcher/ko.appSwitcher.js b/desktop/core/src/desktop/js/ko/components/appSwitcher/ko.appSwitcher.js
@@ -23,13 +23,13 @@ import { getAltusBaseUrl, getMowBaseUrl } from 'ko/components/appSwitcher/enviro
 
 const TEMPLATE = `
   <div class="hue-sidebar-header">
-    <a class="hue-app-switcher-trigger" data-bind="toggle: open"><svg class="show"><use xlink:href="#hi-app-picker"></use></svg></a>
-    <div class="hue-app-switcher-logo"><svg><use xlink:href="#hi-sidebar-logo"></use></svg></div>
+    <a class="hue-app-switcher-trigger" data-bind="toggle: open"><svg class="show"><use href="#hi-app-picker"></use></svg></a>
+    <div class="hue-app-switcher-logo"><svg><use href="#hi-sidebar-logo"></use></svg></div>
   </div>
 
   <div class="hue-app-switcher" data-bind="css: { 'open': open }">
     <div class="app-switcher-header">
-      <svg class="show"><use xlink:href="#hi-cdp-logo"></use></svg>
+      <svg class="show"><use href="#hi-cdp-logo"></use></svg>
       <a href="javascript: void(0);" class="close" data-bind="toggle: open">&times;</a></form>
     </div>
 

diff --git a/desktop/core/src/desktop/js/ko/components/assist/ko.assistDocumentsPanel.js b/desktop/core/src/desktop/js/ko/components/assist/ko.assistDocumentsPanel.js
@@ -157,7 +157,7 @@ const TEMPLATE = `
             <!-- /ko -->
             <li class="divider"></li>
             <li data-bind="css: { 'disabled': $data.isTrash() || $data.isTrashed() || !$data.canModify() }">
-              <a href="javascript:void(0);" data-bind="click: function () { $('.new-document-drop-down').removeClass('open'); huePubSub.publish('show.create.directory.modal', $data); }"><svg class="hi"><use xlink:href="#hi-folder"></use><use xlink:href="#hi-plus-addon"></use></svg> ${I18n(
+              <a href="javascript:void(0);" data-bind="click: function () { $('.new-document-drop-down').removeClass('open'); huePubSub.publish('show.create.directory.modal', $data); }"><svg class="hi"><use href="#hi-folder"></use><use href="#hi-plus-addon"></use></svg> ${I18n(
                 'New folder'
               )}</a>
             </li>

diff --git a/desktop/core/src/desktop/js/ko/components/assist/ko.assistPanel.js b/desktop/core/src/desktop/js/ko/components/assist/ko.assistPanel.js
@@ -46,7 +46,7 @@ const TEMPLATE = `
     <div class="assist-panel-switches">
       <!-- ko foreach: availablePanels -->
       <div class="inactive-action assist-type-switch" data-bind="click: function () { $parent.visiblePanel($data); }, css: { 'blue': $parent.visiblePanel() === $data }, style: { 'float': rightAlignIcon ? 'right' : 'left' },  attr: { 'title': name }">
-        <!-- ko if: iconSvg --><span style="font-size:22px;"><svg class="hi"><use data-bind="attr: {'xlink:href': iconSvg }" xlink:href=''></use></svg></span><!-- /ko -->
+        <!-- ko if: iconSvg --><span style="font-size:22px;"><svg class="hi"><use data-bind="attr: {'href': iconSvg }" href=''></use></svg></span><!-- /ko -->
         <!-- ko if: !iconSvg --><i class="fa fa-fw valign-middle" data-bind="css: icon"></i><!-- /ko -->
       </div>
       <!-- /ko -->