[ENG-1001] Config Kind (#1248)

* config

* cleanup

* cleanup

* clsx

crates/file-ext/src/extensions.rs

@@ -24,6 +24,7 @@ extension_enum! {
 		Code(CodeExtension),
 		Database(DatabaseExtension),
 		Book(BookExtension),
+		Config(ConfigExtension),
 	}
 }
 
@@ -179,6 +180,11 @@ extension_category_enum! {
 		Txt,
 		Rtf,
 		Md,
+	}
+}
+// config file extensions
+extension_category_enum! {
+	ConfigExtension _ALL_CONFIG_EXTENSIONS {
 		Json,
 		Yaml,
 		Yml,

crates/file-ext/src/kind.rs

@@ -1,5 +1,6 @@
 use serde::{Deserialize, Serialize};
 
+// Note: The order of this enum should never change, and always be kept in sync with `packages/client/src/utils/objectKind.ts`
 #[repr(i32)]
 #[derive(Debug, Clone, Copy, Serialize, Deserialize, Eq, PartialEq)]
 pub enum ObjectKind {
@@ -49,4 +50,6 @@ pub enum ObjectKind {
 	Database = 21,
 	/// E-book file
 	Book = 22,
+	/// Config file
+	Config = 23,
 }

interface/app/$libraryId/Explorer/FilePath/LayeredFileIcon.tsx

@@ -1,4 +1,5 @@
 import { getLayeredIcon } from '@sd/assets/util';
+import clsx from 'clsx';
 import { type ImgHTMLAttributes } from 'react';
 import { type ObjectKindKey } from '@sd/client';
 
@@ -7,16 +8,32 @@ interface LayeredFileIconProps extends ImgHTMLAttributes<HTMLImageElement> {
 	extension: string | null;
 }
 
+const SUPPORTED_ICONS = ['Document', 'Code', 'Text', 'Config'];
+
+const positionConfig: Record<string, string> = {
+	Text: 'flex h-full w-full items-center justify-center',
+	Code: 'flex h-full w-full items-center justify-center',
+	Config: 'flex h-full w-full items-center justify-center'
+};
+
 const LayeredFileIcon = ({ kind, extension, ...props }: LayeredFileIconProps) => {
 	const iconImg = <img {...props} />;
+
+	if (SUPPORTED_ICONS.includes(kind) === false) {
+		return iconImg;
+	}
+
 	const IconComponent = extension ? getLayeredIcon(kind, extension) : null;
 
+	const positionClass =
+		positionConfig[kind] || 'flex h-full w-full items-end justify-end pb-4 pr-2';
+
 	return IconComponent == null ? (
 		iconImg
 	) : (
 		<div className="relative">
 			{iconImg}
-			<div className="absolute bottom-0 right-0 flex h-full w-full items-end justify-end pb-4 pr-2">
+			<div className={clsx('absolute bottom-0 right-0', positionClass)}>
 				<IconComponent viewBox="0 0 16 16" height="40%" width="40%" />
 			</div>
 		</div>

interface/app/$libraryId/Explorer/Inspector/Note.tsx

@@ -3,6 +3,7 @@ import { useDebouncedCallback } from 'use-debounce';
 import { Object as SDObject, useLibraryMutation } from '@sd/client';
 import { Divider, TextArea } from '@sd/ui';
 import { MetaContainer, MetaTitle } from '../Inspector';
+import { useExplorerStore } from '../store';
 
 interface Props {
 	data: SDObject;
@@ -11,6 +12,8 @@ interface Props {
 export default function Note(props: Props) {
 	const setNote = useLibraryMutation('files.setNote');
 
+	const explorerStore = useExplorerStore();
+
 	const debouncedSetNote = useDebouncedCallback((note: string) => {
 		setNote.mutate({
 			id: props.data.id,

packages/assets/icons/index.ts

@@ -82,6 +82,7 @@ import Text from './Text.png';
 import TextAlt from './TextAlt.png';
 import TextAlt_Light from './TextAlt_Light.png';
 import Text_Light from './Text_Light.png';
+import Text_txt from './Text_txt.png';
 import TexturedMesh from './TexturedMesh.png';
 import TexturedMesh_Light from './TexturedMesh_Light.png';
 import Trash from './Trash.png';
@@ -174,6 +175,7 @@ export {
 	TextAlt,
 	TextAlt_Light,
 	Text_Light,
+	Text_txt,
 	TexturedMesh,
 	TexturedMesh_Light,
 	Trash,

packages/client/src/utils/objectKind.ts

@@ -23,7 +23,8 @@ export enum ObjectKindEnum {
 	Mesh,
 	Code,
 	Database,
-	Book
+	Book,
+	Config
 }
 
 export type ObjectKindKey = keyof typeof ObjectKindEnum;

pnpm-lock.yaml

@@ -1,4 +1,4 @@
-lockfileVersion: '6.0'
+lockfileVersion: '6.1'
 
 settings:
   autoInstallPeers: true