Refactor PrinterJobsTree component to enhance state display

- Replaced JobState and SubJobState components with a unified StateDisplay component for improved consistency in state representation.
- Updated the rendering logic to utilize StateDisplay for both job and sub-job states, enhancing code clarity and maintainability.

src/components/Dashboard/common/PrinterJobsTree.jsx

@@ -3,15 +3,14 @@ import { Card, Tree, Spin, Space, Button, message } from 'antd'
 import { LoadingOutlined } from '@ant-design/icons'
 import React, { useState, useEffect, useContext } from 'react'
 import { useNavigate } from 'react-router-dom'
-import SubJobState from './SubJobState'
 import { PrintServerContext } from '../context/PrintServerContext'
 import axios from 'axios'
-import JobState from './JobState'
 import JobIcon from '../../Icons/JobIcon'
 import SubJobIcon from '../../Icons/SubJobIcon'
 import ReloadIcon from '../../Icons/ReloadIcon'
 
 import config from '../../../config'
+import StateDisplay from './StateDisplay'
 
 const PrinterJobsTree = ({
   subJobs: initialSubJobs,
@@ -62,7 +61,7 @@ const PrinterJobsTree = ({
           <Space size={5}>
             <JobIcon />
             {'Job'}
-            <JobState state={job?.state} />
+            <StateDisplay state={job?.state} />
           </Space>
         ),
         key: `job-${job._id}`,
@@ -71,8 +70,8 @@ const PrinterJobsTree = ({
             <Space>
               <SubJobIcon />
               {'Sub Job'}
-              <SubJobState
-                subJob={subJob}
+              <StateDisplay
+                state={subJob?.state}
                 showProgress={false}
                 showControls={false}
               />