= async () => {
const labelIdsResponses = await Promise.all(
employees
.filter((employee) => employee.fleetDmLabelId)
- .map((employee) => fleet.get(`/labels/${employee.fleetDmLabelId}/hosts`)),
+ .map(async (employee) => ({
+ userId: employee.userId,
+ response: await fleet.get(`/labels/${employee.fleetDmLabelId}/hosts`),
+ })),
);
- const allIds = labelIdsResponses.flatMap((response) =>
- response.data.hosts.map((host: { id: number }) => host.id),
+
+ const hostRequests = labelIdsResponses.flatMap((entry) =>
+ entry.response.data.hosts.map((host: { id: number }) => ({
+ userId: entry.userId,
+ hostId: host.id,
+ })),
);
// Get all devices by id. in parallel
- const devices = await Promise.all(allIds.map((id: number) => fleet.get(`/hosts/${id}`)));
+ const devices = await Promise.all(hostRequests.map(({ hostId }) => fleet.get(`/hosts/${hostId}`)));
+ const userIds = hostRequests.map(({ userId }) => userId);
- return devices.map((device: { data: { host: Host } }) => device.data.host);
+ const results = await db.fleetPolicyResult.findMany({
+ where: { organizationId },
+ orderBy: { createdAt: 'desc' },
+ });
+
+ return devices.map((device: { data: { host: Host } }, index: number) => {
+ const host = device.data.host;
+ const isMacOS = host.cpu_type && (host.cpu_type.includes('arm64') || host.cpu_type.includes('intel'));
+ return {
+ ...host,
+ policies: [
+ ...(host.policies || []),
+ ...(isMacOS ? [{ id: MDM_POLICY_ID, name: 'MDM Enabled', response: host.mdm.connected_to_fleet ? 'pass' : 'fail' }] : []),
+ ].map((policy) => {
+ const policyResult = results.find((result) => result.fleetPolicyId === policy.id && result.userId === userIds[index]);
+ return {
+ ...policy,
+ response: policy.response === 'pass' || policyResult?.fleetPolicyResponse === 'pass' ? 'pass' : 'fail',
+ attachments: policyResult?.attachments || [],
+ };
+ }),
+ };
+ });
};
diff --git a/apps/app/src/app/(app)/[orgId]/people/devices/types/index.ts b/apps/app/src/app/(app)/[orgId]/people/devices/types/index.ts
index 8c8f8f3a3..b260fe000 100644
--- a/apps/app/src/app/(app)/[orgId]/people/devices/types/index.ts
+++ b/apps/app/src/app/(app)/[orgId]/people/devices/types/index.ts
@@ -1,19 +1,20 @@
export interface FleetPolicy {
id: number;
name: string;
- query: string;
- critical: boolean;
- description: string;
- author_id: number;
- author_name: string;
- author_email: string;
- team_id: number | null;
- resolution: string;
- platform: string;
- calendar_events_enabled: boolean;
- created_at: string; // ISO date-time string
- updated_at: string; // ISO date-time string
+ query?: string;
+ critical?: boolean;
+ description?: string;
+ author_id?: number;
+ author_name?: string;
+ author_email?: string;
+ team_id?: number | null;
+ resolution?: string;
+ platform?: string;
+ calendar_events_enabled?: boolean;
+ created_at?: string; // ISO date-time string
+ updated_at?: string; // ISO date-time string
response: string;
+ attachments?: string[];
}
export interface Host {
diff --git a/apps/app/src/app/api/get-image-url/route.ts b/apps/app/src/app/api/get-image-url/route.ts
new file mode 100644
index 000000000..891d7ea1b
--- /dev/null
+++ b/apps/app/src/app/api/get-image-url/route.ts
@@ -0,0 +1,49 @@
+'use server';
+
+import { auth } from '@/utils/auth';
+import { APP_AWS_ORG_ASSETS_BUCKET, s3Client } from '@/app/s3';
+import { GetObjectCommand } from '@aws-sdk/client-s3';
+import { getSignedUrl } from '@aws-sdk/s3-request-presigner';
+import { NextRequest, NextResponse } from 'next/server';
+
+export async function GET(req: NextRequest) {
+ const session = await auth.api.getSession({ headers: req.headers });
+
+ if (!session?.user) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+ }
+
+ const organizationId = session.session?.activeOrganizationId;
+ if (!organizationId) {
+ return NextResponse.json({ error: 'No active organization' }, { status: 400 });
+ }
+
+ const key = req.nextUrl.searchParams.get('key');
+
+ if (!key) {
+ return NextResponse.json({ error: 'Missing key' }, { status: 400 });
+ }
+
+ // Enforce that the requested key belongs to the caller's organization
+ const orgPrefix = `${organizationId}/`;
+ if (!key.startsWith(orgPrefix)) {
+ return NextResponse.json({ error: 'Forbidden' }, { status: 403 });
+ }
+
+ if (!s3Client || !APP_AWS_ORG_ASSETS_BUCKET) {
+ return NextResponse.json({ error: 'File service unavailable' }, { status: 500 });
+ }
+
+ try {
+ const command = new GetObjectCommand({
+ Bucket: APP_AWS_ORG_ASSETS_BUCKET,
+ Key: key,
+ });
+ const url = await getSignedUrl(s3Client, command, { expiresIn: 3600 });
+
+ return NextResponse.json({ url });
+ } catch (error) {
+ console.error('Failed to generate signed URL', error);
+ return NextResponse.json({ error: 'Failed to generate URL' }, { status: 500 });
+ }
+}
diff --git a/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/DeviceAgentAccordionItem.tsx b/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/DeviceAgentAccordionItem.tsx
index fa37a99e9..eeadee68c 100644
--- a/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/DeviceAgentAccordionItem.tsx
+++ b/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/DeviceAgentAccordionItem.tsx
@@ -11,11 +11,11 @@ import { Button } from '@comp/ui/button';
import { Card, CardContent, CardHeader, CardTitle } from '@comp/ui/card';
import { cn } from '@comp/ui/cn';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@comp/ui/select';
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@comp/ui/tooltip';
import type { Member } from '@db';
-import { CheckCircle2, Circle, Download, HelpCircle, Loader2, XCircle } from 'lucide-react';
+import { CheckCircle2, Circle, Download, Loader2 } from 'lucide-react';
import { useEffect, useMemo, useState } from 'react';
import { toast } from 'sonner';
+import { FleetPolicyItem } from './FleetPolicyItem';
import type { FleetPolicy, Host } from '../../types';
interface DeviceAgentAccordionItemProps {
@@ -37,21 +37,8 @@ export function DeviceAgentAccordionItem({
[detectedOS],
);
- const mdmEnabledStatus = useMemo(() => {
- return {
- id: 'mdm',
- response: host?.mdm.connected_to_fleet ? 'pass' : 'fail',
- name: 'MDM Enabled',
- };
- }, [host]);
-
const hasInstalledAgent = host !== null;
- const failedPoliciesCount = useMemo(() => {
- return (
- fleetPolicies.filter((policy) => policy.response !== 'pass').length +
- (!isMacOS || mdmEnabledStatus.response === 'pass' ? 0 : 1)
- );
- }, [fleetPolicies, mdmEnabledStatus, isMacOS]);
+ const failedPoliciesCount = useMemo(() => fleetPolicies.filter((policy) => policy.response !== 'pass').length, [fleetPolicies]);
const isCompleted = hasInstalledAgent && failedPoliciesCount === 0;
@@ -246,80 +233,8 @@ export function DeviceAgentAccordionItem({
{fleetPolicies.length > 0 ? (
<>
{fleetPolicies.map((policy) => (
-
-
{policy.name}
- {policy.response === 'pass' ? (
-
-
- Pass
-
- ) : (
-
-
- Fail
-
- )}
-
-
-
{mdmEnabledStatus.name}
- {mdmEnabledStatus.response === 'fail' && host?.id && (
-
-
-
-
-
-
-
- There are additional steps required to enable MDM. Please check{' '}
-
- this documentation
-
- .
-
-
-
-
- )}
-
- {mdmEnabledStatus.response === 'pass' ? (
-
-
- Pass
-
- ) : (
-
-
- Fail
-
- )}
-
diff --git a/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/FleetPolicyItem.tsx b/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/FleetPolicyItem.tsx
new file mode 100644
index 000000000..4a2901cda
--- /dev/null
+++ b/apps/portal/src/app/(app)/(home)/[orgId]/components/tasks/FleetPolicyItem.tsx
@@ -0,0 +1,143 @@
+'use client';
+
+import { useMemo, useState } from 'react';
+
+import { Button } from '@comp/ui/button';
+import { cn } from '@comp/ui/cn';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@comp/ui/tooltip';
+import { CheckCircle2, HelpCircle, Image, MoreVertical, Upload, XCircle } from 'lucide-react';
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuTrigger,
+} from '@comp/ui/dropdown-menu';
+import type { FleetPolicy } from '../../types';
+import { PolicyImageUploadModal } from './PolicyImageUploadModal';
+import { PolicyImagePreviewModal } from './PolicyImagePreviewModal';
+
+interface FleetPolicyItemProps {
+ policy: FleetPolicy;
+}
+
+export function FleetPolicyItem({ policy }: FleetPolicyItemProps) {
+ const [isUploadOpen, setIsUploadOpen] = useState(false);
+ const [isPreviewOpen, setIsPreviewOpen] = useState(false);
+ const [dropdownOpen, setDropdownOpen] = useState(false);
+
+ const actions = useMemo(() => {
+ if (policy.response === 'pass') {
+ if ((policy?.attachments || []).length > 0) {
+ return [
+ {
+ label: 'Preview images',
+ renderIcon: () => ,
+ onClick: () => setIsPreviewOpen(true),
+ },
+ ];
+ }
+
+ return [];
+ }
+
+ return [
+ {
+ label: 'Upload images',
+ renderIcon: () => ,
+ onClick: () => setIsUploadOpen(true),
+ }
+ ]
+ }, [policy]);
+
+ const hasActions = useMemo(() => actions.length > 0, [actions]);
+
+ return (
+ <>
+
+
+
{policy.name}
+ {policy.name === 'MDM Enabled' && policy.response === 'fail' && (
+
+
+
+
+
+
+
+ There are additional steps required to enable MDM. Please check{' '}
+
+ this documentation
+
+ .
+
+
+
+
+ )}
+
+
+ {policy.response === 'pass' ? (
+
+
+ Pass
+
+ ) : (
+
+
+ Fail
+
+ )}
+
+
+
+
+
+ {actions.map(({ label, renderIcon, onClick }) => (
+ {
+ event.preventDefault();
+ onClick();
+ setDropdownOpen(false);
+ }}
+ >
+ {renderIcon()}
+ {label}
+
+ ))}
+
+
+
+