update host details cert card (#29827)

Relates to  [#29324](https://github.com/fleetdm/fleet/issues/29324)

updates certificates card UI on the host details and my devices page.
changes some copy and adds a new Keychain column.


![image](https://github.com/user-attachments/assets/3310cd61-4447-499b-8d03-9a987fbcaed7)

- [x] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/guides/committing-changes.md#changes-files)
for more information.
- [x] Manual QA for all new/changed functionality

changes/issue-29827-update-ui-for-certs

@@ -0,0 +1,2 @@
+- update Certificates card on the host details and my device page to show a new
+keychain column

frontend/__mocks__/certificatesMock.ts

@@ -24,6 +24,8 @@ const DEFAULT_HOST_CERTIFICATE_MOCK: IHostCertificate = {
     organizational_unit: "Test Inc.",
     common_name: "Test Biz",
   },
+  source: "system",
+  username: "",
 };
 
 export const createMockHostCertificate = (

frontend/interfaces/certificates.ts

@@ -23,6 +23,8 @@ export interface IHostCertificate {
     organizational_unit: string;
     common_name: string;
   };
+  source: string;
+  username: string;
 }
 
 export const CERTIFICATES_DEFAULT_SORT: IListSort = {

frontend/pages/hosts/details/cards/Certificates/CertificatesTable/CertificatesTable.tsx

@@ -66,8 +66,8 @@ const CertificatesTable = ({
 
   const helpText = showHelpText ? (
     <p>
-      Showing certificates in the system keychain. To get all certificates, you
-      can query the certificates table.{" "}
+      Showing certificates in the system and login (user) keychain. To get all
+      certificates, you can query the certificates table.{" "}
       <CustomLink
         text="Learn more"
         url="https://fleetdm.com/learn-more-about/certificates-query"

frontend/pages/hosts/details/cards/Certificates/CertificatesTable/CertificatesTableConfig.tsx

@@ -10,6 +10,8 @@ import TextCell from "components/TableContainer/DataTable/TextCell";
 import ViewAllHostsLink from "components/ViewAllHostsLink";
 import StatusIndicator from "components/StatusIndicator";
 import { IIndicatorValue } from "components/StatusIndicator/StatusIndicator";
+import TooltipTruncatedTextCell from "components/TableContainer/DataTable/TooltipTruncatedTextCell";
+import TooltipWrapper from "components/TooltipWrapper";
 
 type IHostCertificatesTableConfig = Column<IHostCertificate>;
 
@@ -22,6 +24,23 @@ const generateTableConfig = (): IHostCertificatesTableConfig[] => {
       ),
       Cell: (cellProps) => <TextCell value={cellProps.cell.value} />,
     },
+    {
+      accessor: "source",
+      disableSortBy: true,
+      Header: "Keychain",
+      Cell: (cellProps) => {
+        if (cellProps.cell.value === "system") {
+          return <TextCell value="System" />;
+        }
+        return (
+          <TooltipWrapper
+            tipContent={cellProps.cell.row.original.username || "Unknown user"}
+          >
+            User
+          </TooltipWrapper>
+        );
+      },
+    },
     {
       accessor: "not_valid_after",
       Header: (cellProps) => (