handle course_template_id in account list

Change-Id: I14d2c15c0a5922cad1f8f44f224c2f6d35cf8284
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/355450
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: August Thornton <august@instructure.com>
QA-Review: August Thornton <august@instructure.com>
Product-Review: Aaron Shafovaloff <ashafovaloff@instructure.com>

ui/features/account_manage/react/AccountList.tsx

@@ -17,6 +17,7 @@
  */
 
 import React, {useState} from 'react'
+// @ts-expect-error
 import errorShipUrl from '@canvas/images/ErrorShip.svg'
 import {Spinner} from '@instructure/ui-spinner'
 import {AccountNavigation} from './AccountNavigation'
@@ -24,10 +25,11 @@ import {useScope as useI18nScope} from '@canvas/i18n'
 import {View} from '@instructure/ui-view'
 import getAccounts from '@canvas/api/accounts/getAccounts'
 import {useQuery} from '@canvas/query'
-import {IconSettingsLine} from '@instructure/ui-icons'
+import {IconCoursesLine, IconSettingsLine} from '@instructure/ui-icons'
 import GenericErrorPage from '@canvas/generic-error-page/react'
 import {Table} from '@instructure/ui-table'
 import {IconButton} from '@instructure/ui-buttons'
+import {Tooltip} from '@instructure/ui-tooltip'
 
 const I18n = useI18nScope('account_manage')
 
@@ -94,6 +96,7 @@ export function AccountList() {
         <Table.Body>
           {accounts?.map(account => {
             const settingsTip = I18n.t('Settings for %{name}', {name: account.name})
+            const courseTemplateTip = I18n.t('Course template for %{name}', {name: account.name})
 
             return (
               <Table.Row key={account.id}>
@@ -105,6 +108,21 @@ export function AccountList() {
                 </Table.Cell>
                 <Table.Cell>{account.course_count}</Table.Cell>
                 <Table.Cell textAlign="end">
+                  {account.course_template_id && (
+                    <Tooltip placement="start center" offsetX={5} renderTip={courseTemplateTip}>
+                      <IconButton
+                        withBorder={false}
+                        withBackground={false}
+                        size="small"
+                        href={`/courses/${account.course_template_id}`}
+                        screenReaderLabel={courseTemplateTip}
+                      >
+                        <IconCoursesLine title={courseTemplateTip} />
+                      </IconButton>
+                    </Tooltip>
+                  )}
+
+                  <Tooltip placement="start center" offsetX={5} renderTip={settingsTip}>
                     <IconButton
                       withBorder={false}
                       withBackground={false}
@@ -114,6 +132,7 @@ export function AccountList() {
                     >
                       <IconSettingsLine title={settingsTip} />
                     </IconButton>
+                  </Tooltip>
                 </Table.Cell>
               </Table.Row>
             )

ui/shared/api/accounts/getAccounts.ts

@@ -24,6 +24,7 @@ import {z} from 'zod'
 const ZAccountWithCounts = ZAccount.extend({
   course_count: z.number(),
   sub_account_count: z.number(),
+  course_template_id: z.string().nullish(),
 }).strict()
 
 const ZAccounts = z.array(ZAccountWithCounts)