44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import React from "react";
|
|
import { Dropdown } from "../ui/Dropdown";
|
|
import { SettingContainer } from "../ui/SettingContainer";
|
|
import { useSettings } from "../../hooks/useSettings";
|
|
import type { OverlayPosition } from "../../lib/types";
|
|
|
|
interface ShowOverlayProps {
|
|
descriptionMode?: "inline" | "tooltip";
|
|
grouped?: boolean;
|
|
}
|
|
|
|
const overlayOptions = [
|
|
{ value: "none", label: "None" },
|
|
{ value: "bottom", label: "Bottom" },
|
|
{ value: "top", label: "Top" },
|
|
];
|
|
|
|
export const ShowOverlay: React.FC<ShowOverlayProps> = React.memo(({
|
|
descriptionMode = "tooltip",
|
|
grouped = false,
|
|
}) => {
|
|
const { getSetting, updateSetting, isUpdating } = useSettings();
|
|
|
|
const selectedPosition = (getSetting("overlay_position") ||
|
|
"bottom") as OverlayPosition;
|
|
|
|
return (
|
|
<SettingContainer
|
|
title="Overlay Position"
|
|
description="Display visual feedback overlay during recording and transcription"
|
|
descriptionMode={descriptionMode}
|
|
grouped={grouped}
|
|
>
|
|
<Dropdown
|
|
options={overlayOptions}
|
|
selectedValue={selectedPosition}
|
|
onSelect={(value) =>
|
|
updateSetting("overlay_position", value as OverlayPosition)
|
|
}
|
|
disabled={isUpdating("overlay_position")}
|
|
/>
|
|
</SettingContainer>
|
|
);
|
|
});
|