1 files changed, 4 insertions, 4 deletions
diff --git a/web_src/js/components/RepoActivityTopAuthors.vue b/web_src/js/components/RepoActivityTopAuthors.vue
index 77b85bd7e2..bbdfda41d0 100644
--- a/web_src/js/components/RepoActivityTopAuthors.vue
+++ b/web_src/js/components/RepoActivityTopAuthors.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 // @ts-expect-error - module exports no types
 import {VueBarGraph} from 'vue-bar-graph';
-import {computed, onMounted, ref} from 'vue';
+import {computed, onMounted, shallowRef, useTemplateRef} from 'vue';
 
-const colors = ref({
+const colors = shallowRef({
   barColor: 'green',
   textColor: 'black',
   textAltColor: 'white',
@@ -41,8 +41,8 @@ const graphWidth = computed(() => {
   return activityTopAuthors.length * 40;
 });
 
-const styleElement = ref<HTMLElement | null>(null);
-const altStyleElement = ref<HTMLElement | null>(null);
+const styleElement = useTemplateRef('styleElement');
+const altStyleElement = useTemplateRef('altStyleElement');
 
 onMounted(() => {
   const refStyle = window.getComputedStyle(styleElement.value);