diff --git a/components/JobAccessoryPopover/index.tsx b/components/JobAccessoryPopover/index.tsx
index fa3bb6ba..8f7ae501 100644
--- a/components/JobAccessoryPopover/index.tsx
+++ b/components/JobAccessoryPopover/index.tsx
@@ -1,9 +1,11 @@
 import React, { PropsWithChildren, useEffect, useState } from 'react'
 import { useRouter } from 'next/router'
 import { useTranslation } from 'next-i18next'
+import classNames from 'classnames'
+
+import capitalizeFirstLetter from '~utils/capitalizeFirstLetter'
 
 import * as RadioGroup from '@radix-ui/react-radio-group'
-
 import Button from '~components/Button'
 import {
   Popover,
@@ -13,7 +15,6 @@ import {
 import JobAccessoryItem from '~components/JobAccessoryItem'
 
 import './index.scss'
-import classNames from 'classnames'
 
 interface Props {
   buttonref: React.RefObject<HTMLButtonElement>
@@ -80,10 +81,6 @@ const JobAccessoryPopover = ({
     onOpenChange(false)
   }
 
-  function capitalizeFirstLetter(string: string) {
-    return string.charAt(0).toUpperCase() + string.slice(1)
-  }
-
   const radioGroup = (
     <>
       <h3>
diff --git a/utils/capitalizeFirstLetter.tsx b/utils/capitalizeFirstLetter.tsx
new file mode 100644
index 00000000..5dd33934
--- /dev/null
+++ b/utils/capitalizeFirstLetter.tsx
@@ -0,0 +1,3 @@
+export default function capitalizeFirstLetter(string: string) {
+  return string.charAt(0).toUpperCase() + string.slice(1)
+}