mirror of
https://github.com/fleetdm/fleet
synced 2026-04-21 21:47:20 +00:00
Addresses #17445 Follow-up iteration: - Finalize styling of dropdown tooltips - All `//TODO`s <img width="1393" alt="Screenshot 2024-03-20 at 1 43 54 PM" src="https://github.com/fleetdm/fleet/assets/61553566/9b792cf0-058a-4ae6-8f5f-a49eb936ebef"> <img width="1393" alt="Screenshot 2024-03-20 at 1 44 01 PM" src="https://github.com/fleetdm/fleet/assets/61553566/86195dcf-ec28-4cf0-ab8b-d785d12372ed"> <img width="1393" alt="Screenshot 2024-03-20 at 1 44 21 PM" src="https://github.com/fleetdm/fleet/assets/61553566/01effdec-ca20-49ec-a442-5fe754a5e12b"> <img width="1393" alt="Screenshot 2024-03-20 at 1 44 26 PM" src="https://github.com/fleetdm/fleet/assets/61553566/b6de6891-6eae-426e-bbff-b01184094ac9"> <img width="1393" alt="Screenshot 2024-03-20 at 1 44 33 PM" src="https://github.com/fleetdm/fleet/assets/61553566/96e167dd-752c-4b49-a1a7-69fe9b4f42ac"> <img width="1393" alt="Screenshot 2024-03-20 at 1 44 43 PM" src="https://github.com/fleetdm/fleet/assets/61553566/feedbda5-e915-4e5e-84ee-2316db49434a"> <img width="1393" alt="Screenshot 2024-03-20 at 1 44 47 PM" src="https://github.com/fleetdm/fleet/assets/61553566/c4b5ac47-3357-43ef-95ca-dd0953994f6f"> <img width="1393" alt="Screenshot 2024-03-20 at 1 45 02 PM" src="https://github.com/fleetdm/fleet/assets/61553566/17838415-5bf4-46f0-9bde-522deb0f0886"> <img width="1393" alt="Screenshot 2024-03-20 at 1 45 10 PM" src="https://github.com/fleetdm/fleet/assets/61553566/b7228484-bb9f-4119-9fbf-a60ce990ba0e"> --------- Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
36 lines
834 B
TypeScript
36 lines
834 B
TypeScript
import { useState } from "react";
|
|
|
|
import { IPolicy } from "interfaces/policy";
|
|
|
|
interface ICheckedPolicy {
|
|
name?: string;
|
|
id: number;
|
|
isChecked: boolean;
|
|
}
|
|
|
|
const useCheckboxListStateManagement = (
|
|
allPolicies: IPolicy[],
|
|
automatedPolicies: number[] | undefined
|
|
) => {
|
|
const [policyItems, setPolicyItems] = useState<ICheckedPolicy[]>(() => {
|
|
return allPolicies.map(({ name, id }) => ({
|
|
name,
|
|
id,
|
|
isChecked: !!automatedPolicies?.includes(id),
|
|
}));
|
|
});
|
|
|
|
const updatePolicyItems = (policyId: number) => {
|
|
setPolicyItems((prevItems) =>
|
|
prevItems.map((policy) =>
|
|
policy.id !== policyId
|
|
? policy
|
|
: { ...policy, isChecked: !policy.isChecked }
|
|
)
|
|
);
|
|
};
|
|
|
|
return { policyItems, updatePolicyItems };
|
|
};
|
|
|
|
export default useCheckboxListStateManagement;
|