This commit is contained in:
ameer2468 2023-11-21 15:39:22 +03:00
parent 76d714c752
commit c8a367104f
3 changed files with 25 additions and 10 deletions

View file

@ -21,7 +21,12 @@ pub const PDF_EXTENSIONS: [&str; 1] = ["pdf"];
pub const HEIF_EXTENSIONS: [&str; 7] = ["heif", "heifs", "heic", "heics", "avif", "avci", "avcs"];
/// It is 512x512, but if the SVG has a non-1:1 aspect ratio we need to account for that.
pub const SVG_TAGRET_PX: f32 = 262_144_f32;
pub const SVG_TARGET_PX: f32 = 262_144_f32;
/// The size that PDF pages are rendered at.
///
/// This is 120 DPI at standard A4 printer paper size - the target aspect
/// ratio and height are maintained.
pub const PDF_RENDER_WIDTH: pdfium_render::prelude::Pixels = 992;
#[cfg_attr(feature = "specta", derive(specta::Type))]
#[cfg_attr(feature = "bincode", derive(bincode::Encode, bincode::Decode))]

View file

@ -1,4 +1,3 @@
import { Images } from '@phosphor-icons/react';
import clsx from 'clsx';
import { useState } from 'react';
import { Controller } from 'react-hook-form';
@ -23,7 +22,7 @@ import {
UseDialogProps
} from '@sd/ui';
import { LocationIdParamsSchema } from '~/app/route-schemas';
import Accordion from '~/components/Accordion';
import { Accordion, Icon } from '~/components';
import { useZodRouteParams } from '~/hooks';
type QualityLevel = {
@ -71,8 +70,8 @@ const ImageDialog = (props: DialogProps) => {
try {
await convertImage.mutateAsync({
location_id: locationId,
file_path_id: ('object_id' in props.selectedItem.item
? props.selectedItem.item.object_id
file_path_id: ('id' in props.selectedItem.item
? props.selectedItem.item.id
: null) as number,
delete_src: data.keepOriginal,
desired_extension: data.type as ConvertableExtension,
@ -93,7 +92,8 @@ const ImageDialog = (props: DialogProps) => {
ctaLabel="Convert"
description="Transform your image to a different format and quality"
closeLabel="Cancel"
icon={<Images weight="fill" width={20} height={20} />}
className="relative"
icon={<Icon className="" size={34} name="Image" />}
>
<div className="flex flex-col mt-3 gap-y-3">
<div className="grid items-center justify-between grid-cols-2 gap-2">
@ -115,7 +115,11 @@ const ImageDialog = (props: DialogProps) => {
name="type"
control={form.control}
render={({ field }) => (
<Select placeholder="Select type..." className="w-full" {...field}>
<Select
placeholder="Select type..."
className="h-[30px] w-full"
{...field}
>
{extensions.data?.map((value) => (
<SelectOption key={value} value={value}>
{value}

View file

@ -38,6 +38,7 @@ export interface SelectProps<TValue extends string = string>
placeholder?: string;
className?: string;
disabled?: boolean;
dropDownClassName?: string;
}
export const Select = forwardRef(
@ -62,7 +63,12 @@ export const Select = forwardRef(
</RS.Trigger>
<RS.Portal>
<RS.Content className="z-50 rounded-md border border-app-line bg-app-box shadow-2xl shadow-app-shade/20 ">
<RS.Content
className={clsx(
'z-50 rounded-md border border-app-line bg-app-box shadow-2xl shadow-app-shade/20',
props.dropDownClassName
)}
>
<RS.Viewport className="p-1">{props.children}</RS.Viewport>
</RS.Content>
</RS.Portal>
@ -86,8 +92,8 @@ export function SelectOption(props: PropsWithChildren<{ value: string; default?:
)}
>
<RS.ItemText>{props.children}</RS.ItemText>
<RS.ItemIndicator className="absolute left-1 inline-flex items-center">
<Check className="h-4 w-4" />
<RS.ItemIndicator className="absolute inline-flex items-center left-1">
<Check className="w-4 h-4" />
</RS.ItemIndicator>
</RS.Item>
);