mirror of
https://github.com/spacedriveapp/spacedrive.git
synced 2026-04-21 06:59:17 -04:00
50442ede3e
* Make Prettier and ESLint work together - Resolve conflicts between Prettier and ESLint regarding indentation and Tailwind rules order - Add `.editorconfig` to standardize basic formatting options across tools and editors - Add `.gitattributes` to hide `pnpm-lock.yaml` in `git diff` output - Include EditorConfig in the recommended extensions for VSCode - Replace some instances of `pnpm exec <command>` with `pnpm <command>` - Remove superfluous Tauri config for Linux * Revert Prettier changes (it was working correctly before) - Update ESLint to read Tailwind config from absolute path - Remove redundant Prettier dependency from subprojects - Specify the source folder for the lint script in subprojects * use mobile's tailwind config with eslint * pnpm format + pnpm lint:fix --------- Co-authored-by: Utku Bakir <74243531+utkubakir@users.noreply.github.com>
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import { useQuery } from '@tanstack/react-query';
|
|
import { ScreenHeading } from '@sd/ui';
|
|
import { usePlatform } from '~/util/Platform';
|
|
|
|
export const Component = () => {
|
|
const frontEnd = useQuery(
|
|
['frontend-deps'],
|
|
() => import('@sd/assets/deps/frontend-deps.json')
|
|
);
|
|
const backEnd = useQuery(['backend-deps'], () => import('@sd/assets/deps/backend-deps.json'));
|
|
const platform = usePlatform();
|
|
|
|
return (
|
|
<div className="custom-scroll page-scroll app-background flex h-screen w-full flex-col p-5">
|
|
<ScreenHeading>Dependencies</ScreenHeading>
|
|
|
|
{/* item has a LOT more data that we can display, i just went with the basics */}
|
|
|
|
<ScreenHeading className="mb-2">Frontend Dependencies</ScreenHeading>
|
|
<div className="grid gap-6 space-x-1 xl:grid-cols-4 2xl:grid-cols-6">
|
|
{frontEnd.data &&
|
|
frontEnd.data?.default.map((item) => {
|
|
return (
|
|
<a key={item.title} onClick={() => platform.openLink(item.url ?? '')}>
|
|
<div className="rounded border-2 border-gray-500 p-4 text-gray-300">
|
|
<h4 className="text-center">
|
|
{item.title.trimEnd().substring(0, 24) +
|
|
(item.title.length > 24 ? '...' : '')}
|
|
</h4>
|
|
</div>
|
|
</a>
|
|
);
|
|
})}
|
|
</div>
|
|
|
|
<ScreenHeading className="mb-2">Backend Dependencies</ScreenHeading>
|
|
<div className="grid gap-6 space-x-1 lg:grid-cols-7">
|
|
{backEnd.data &&
|
|
backEnd.data?.default.map((item) => {
|
|
return (
|
|
<a key={item.title} onClick={() => platform.openLink(item.url ?? '')}>
|
|
<div className="rounded border-2 border-gray-500 p-4 text-gray-300">
|
|
<h4 className="text-center">{item.title.trimEnd()}</h4>
|
|
</div>
|
|
</a>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|