Skip to content

Commit

Permalink
i dont know but it works made a new CameraPresetSelect file
Browse files Browse the repository at this point in the history
  • Loading branch information
bishwas-10 committed Apr 17, 2024
1 parent b0444a8 commit d9f1321
Show file tree
Hide file tree
Showing 2 changed files with 70 additions and 51 deletions.
63 changes: 63 additions & 0 deletions src/Components/CameraFeed/CameraPresetSelect.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
import { Fragment } from "react";
import { Listbox, Transition } from "@headlessui/react";
import CareIcon from "../../CAREUI/icons/CareIcon";

interface Props {
asset?: any[];
value?: any;
onChange?: (value: any) => void;
}

export default function CameraPresetSelect(props: Props) {
const selected = props.value;
const selectedPresetValue = (presetObject: any) => {
return { name: "preset", value: presetObject?.meta?.preset_name };
};

return (
<Listbox value={selected} onChange={props.onChange}>
<div className="relative">
<Listbox.Button className="relative w-full cursor-default pr-6 text-right text-xs text-zinc-400 focus:outline-none disabled:cursor-not-allowed disabled:bg-transparent disabled:text-zinc-700 sm:text-sm">
<span className="block truncate">
{selected?.meta?.preset_name ?? "No Preset"}
</span>
<span className="pointer-events-none absolute inset-y-0 right-0 mt-1 flex items-center">
<CareIcon icon="l-angle-down" className="text-lg text-zinc-500" />
</span>
</Listbox.Button>
<Transition
as={Fragment}
leave="transition ease-in duration-100"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<Listbox.Options className="absolute z-20 mt-1 max-h-48 w-full overflow-auto rounded-b-lg bg-zinc-900/75 py-1 text-base shadow-lg ring-1 ring-white/5 backdrop-blur-sm focus:outline-none sm:text-sm md:max-h-60">
{props.asset?.map((obj) => (
<Listbox.Option
key={obj.id}
className={({ active }) =>
`relative cursor-default select-none px-2 py-1 ${
active ? "bg-zinc-700 text-white" : "text-zinc-400"
}`
}
value={selectedPresetValue(obj)}
>
{({ selected }) => (
<>
<span
className={`block truncate text-xs md:text-sm ${
selected ? "font-bold text-white" : "font-normal"
}`}
>
{obj.meta.preset_name}
</span>
</>
)}
</Listbox.Option>
))}
</Listbox.Options>
</Transition>
</div>
</Listbox>
);
}
58 changes: 7 additions & 51 deletions src/Components/Facility/Consultations/Feed.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,9 @@ import { triggerGoal } from "../../../Integrations/Plausible.js";
import useAuthUser from "../../../Common/hooks/useAuthUser.js";
import Spinner from "../../Common/Spinner.js";
import useQuery from "../../../Utils/request/useQuery.js";
import { AssetBedModel, ResolvedMiddleware } from "../../Assets/AssetTypes.js";
import { ResolvedMiddleware } from "../../Assets/AssetTypes.js";
import { SelectFormField } from "../../Form/FormFields/SelectFormField.js";
import CameraPresetSelect from "../../CameraFeed/CameraPresetSelect.js";

interface IFeedProps {
facilityId: string;
Expand Down Expand Up @@ -142,7 +143,6 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId }) => {
const [presets, setPresets] = useState<any>([]);
const [currentPreset, setCurrentPreset] = useState<any>();
// const [showDefaultPresets, setShowDefaultPresets] = useState<boolean>(false);
const [preset, setPreset] = useState<AssetBedModel>();
const [loading, setLoading] = useState<string>(CAMERA_STATES.IDLE);
const [camTimeout, setCamTimeout] = useState<number>(0);
useEffect(() => {
Expand Down Expand Up @@ -400,7 +400,6 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId }) => {
}

if (getConsultationLoading) return <Loading />;
console.log(bedPresets);
return (
<div className="flex h-[calc(100vh-1.5rem)] flex-col px-2">
<div className="flex flex-wrap items-center justify-between gap-2">
Expand All @@ -418,50 +417,7 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId }) => {
optionLabel={(preset: any) => preset}
optionValue={(preset: any) => preset}
value={currentPreset?.meta?.preset_name}
onChange={(selectedPreset: any) => {
if (selectedPreset.value === undefined) {
setCurrentPreset(undefined);
return;
} else {
const presetDetails = bedPresets?.filter(
(preset: any) =>
preset?.meta?.preset_name === selectedPreset.value
);
setLoading(CAMERA_STATES.MOVING.GENERIC);
absoluteMove(
presetDetails.length > 0 && presetDetails[0].meta?.position,
{
onSuccess: () => {
setLoading(CAMERA_STATES.IDLE);
setCurrentPreset(presetDetails[0]);
console.log(
"onSuccess: Set Preset to " + selectedPreset.value
);
triggerGoal("Camera Preset Clicked", {
presetName: selectedPreset.value,
consultationId,
userId: authUser.id,
result: "success",
});
},
onError: () => {
setLoading(CAMERA_STATES.IDLE);
setCurrentPreset(presetDetails[0]);
console.log(
"onError: Set Preset to " + selectedPreset.value
);
triggerGoal("Camera Preset Clicked", {
presetName: selectedPreset.value,
consultationId,
userId: authUser.id,
result: "error",
});
},
}
);
getCameraStatus({});
}
}}
onChange={(preset: any) => cameraPresetChange(preset)}
className="w-40 md:w-60 "
/>
>>>>>>> 323c32c1 (need help)
Expand All @@ -475,15 +431,15 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId }) => {
</span>

<div className="w-64">
<AssetBedSelect
<CameraPresetSelect
asset={bedPresets}
value={preset}
onChange={setPreset}
value={currentPreset}
onChange={cameraPresetChange}
/>
</div>
</div>
<div
className="relative flex aspect-video w-full grow-0 flex-col items-center justify-center overflow-hidden rounded-b-xl bg-black"
className="relative flex aspect-video w-full grow-0 flex-col items-center justify-center overflow-hidden rounded-b-xl bg-black md:mt-2"
ref={videoWrapper}
>
{isIOS ? (
Expand Down

0 comments on commit d9f1321

Please sign in to comment.