Merge branch 'main' into lorissigrist/mesdk-81-requirements-for-modul…

…e-caching

inlang/source-code/editor/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @inlang/editor
 
+## 0.1.3
+
+### Patch Changes
+
+- 9886cfa: show project names instead of paths
+
 ## 0.1.2
 
 ### Patch Changes

inlang/source-code/editor/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@inlang/editor",
-	"version": "0.1.2",
+	"version": "0.1.3",
 	"type": "module",
 	"private": true,
 	"scripts": {

inlang/source-code/editor/src/pages/@host/@owner/@repository/Layout.tsx

@@ -533,27 +533,20 @@ function ProjectMenu() {
 	const { project, activeProject, setActiveProject, projectList, currentBranch, activeBranch } =
 		useEditorState()
 
-	const activeProjectName = () => {
-		return (
-			activeProject()?.toString().split("/").at(-2) +
-			"/" +
-			activeProject()?.toString().split("/").at(-1)
-		)
-	}
-
-	const shortenProjectName = (projectPath: string) => {
+	const shortenProjectPath = (projectPath: string) => {
 		const projectPathArray = projectPath.split("/")
 		if (projectPathArray.length > 3) {
-			return (
-				"/" +
-				projectPathArray.at(-3) +
-				"/" +
-				projectPathArray.at(-2) +
-				"/" +
-				projectPathArray.at(-1)
-			)
+			return ".../" + projectPathArray.at(-3) + "/" + projectPathArray.at(-2)
+		} else if (projectPathArray.length > 2) {
+			return ".../" + projectPathArray.at(-2)
+		} else {
+			return "./"
 		}
-		return projectPath
+	}
+
+	const projectName = (projectPath: string) => {
+		const projectPathArray = projectPath.split("/")
+		return projectPathArray.at(-1)?.replace(".inlang", "")
 	}
 
 	return (
@@ -576,20 +569,23 @@ function ProjectMenu() {
 					<div slot="prefix">
 						<IconDescription class="-ml-1 w-5 h-5" />
 					</div>
-					{activeProject() ? activeProjectName() : "project"}
+					{activeProject() ? projectName(activeProject()!) : "project"}
 				</sl-button>
 
 				<sl-menu class="w-48 min-w-fit">
 					<For each={projectList()}>
 						{(project) => (
-							<div onClick={() => setActiveProject(project.projectPath)}>
-								<sl-menu-item
-									prop:type="checkbox"
-									prop:checked={activeProject() === project.projectPath}
-								>
-									{shortenProjectName(project.projectPath)}
-								</sl-menu-item>
-							</div>
+							<sl-menu-item
+								prop:type="checkbox"
+								prop:checked={activeProject() === project.projectPath}
+								onClick={() => setActiveProject(project.projectPath)}
+								class="flex items-center"
+							>
+								{projectName(project.projectPath)}
+								<span class="text-on-surface-variant/60 ml-2 text-xs">
+									{shortenProjectPath(project.projectPath)}
+								</span>
+							</sl-menu-item>
 						)}
 					</For>
 				</sl-menu>
@@ -720,7 +716,7 @@ function LintFilter(props: { clearFunction: any }) {
 			}}
 			class="filter border-0 focus:ring-background/100 p-0 m-0 text-sm animate-blendIn"
 		>
-			<div class={"flex items-center gap-2 ml-1 mr-0"} slot="prefix">
+			<div class="flex items-center gap-2 ml-1 mr-0" slot="prefix">
 				<p class="flex-grow-0 flex-shrink-0 text-sm font-medium text-left text-on-surface-variant">
 					Lint
 				</p>

inlang/source-code/editor/src/pages/@host/@owner/@repository/State.tsx

@@ -439,7 +439,8 @@ export function EditorStateProvider(props: { children: JSXElement }) {
 			} else if (projectList.length === 1) {
 				setActiveProject(projectList[0]?.projectPath)
 			} else if (
-				previousProject && projectList.some((project) => project.projectPath === previousProject)
+				previousProject &&
+				projectList.some((project) => project.projectPath === previousProject)
 			) {
 				setActiveProject(previousProject)
 			} else if (
@@ -458,22 +459,27 @@ export function EditorStateProvider(props: { children: JSXElement }) {
 		params.get("project") || undefined
 	)
 
-	createEffect(on(activeProject, () => {
-		const projectPath = activeProject()
-		if (projectPath) {
-			setSearchParams({ key: "project", value: projectPath })
-			// update project of recentProject in local storage
-			setLocalStorage({
-				recentProjects: localStorage.recentProjects.map((project) => {
-					if (project.repository === routeParams().repository && project.owner === routeParams().owner) {
-						return { ...project, project: projectPath }
-					} else {
-						return project
-					}
-				}),
-			})
-		}
-	}))
+	createEffect(
+		on(activeProject, () => {
+			const projectPath = activeProject()
+			if (projectPath) {
+				setSearchParams({ key: "project", value: projectPath })
+				// update project of recentProject in local storage
+				setLocalStorage({
+					recentProjects: localStorage.recentProjects.map((project) => {
+						if (
+							project.repository === routeParams().repository &&
+							project.owner === routeParams().owner
+						) {
+							return { ...project, project: projectPath }
+						} else {
+							return project
+						}
+					}),
+				})
+			}
+		})
+	)
 
 	// polyfill requestIdleCallback for Safari browser
 	const requestIdleCallback =

inlang/source-code/editor/src/pages/@host/@owner/@repository/components/SearchInput.tsx

@@ -5,6 +5,7 @@ import IconSearch from "~icons/material-symbols/search"
 interface SearchInputProps {
 	placeholder: string
 	handleChange: (value: string) => void
+	class?: string
 }
 
 export const SearchInput = (props: SearchInputProps) => {
@@ -14,24 +15,23 @@ export const SearchInput = (props: SearchInputProps) => {
 	createEffect(() => props.handleChange(textValue()))
 
 	return (
-		<div>
-			<sl-input
-				style={{
-					padding: "0px",
-					border: "none",
-					"--tw-ring-color": "#06B6D4",
-					"border-radius": "4px",
-				}}
-				prop:placeholder={props.placeholder}
-				prop:size={"small"}
-				prop:value={textValue()}
-				onInput={(e) => setTextValue(e.currentTarget.value)}
-			>
-				<div slot={"suffix"}>
-					<IconSearch class="w-5 h-5 -mr-1 text-outline-variant" />
-				</div>
-			</sl-input>
-		</div>
+		<sl-input
+			style={{
+				padding: "0px",
+				border: "none",
+				"--tw-ring-color": "#06B6D4",
+				"border-radius": "4px",
+			}}
+			prop:placeholder={props.placeholder}
+			prop:size={"small"}
+			prop:value={textValue()}
+			onInput={(e) => setTextValue(e.currentTarget.value)}
+			class={props.class}
+		>
+			<div slot={"suffix"}>
+				<IconSearch class="w-5 h-5 -mr-1 text-outline-variant" />
+			</div>
+		</sl-input>
 	)
 }
 

inlang/source-code/editor/src/pages/repositories.ts

@@ -5,11 +5,6 @@
  * list and add your repository below.
  */
 export const repositories: Repositories = [
-	{
-		owner: "LorisSigrist",
-		repository: "merge-berlin-lix-demo",
-		description: "Experience lix in your browser",
-	},
 	{
 		owner: "opral",
 		repository: "example",

inlang/source-code/editor/src/renderer/app.css

@@ -214,7 +214,7 @@ sl-select::part(combobox):hover {
 	background-color: theme(colors.surface-1);
 }
 
-sl-select::part(expand-icon) {
+sl-select.filter::part(expand-icon) {
 	display: none;
 }
 
@@ -325,6 +325,10 @@ sl-menu {
 		var(--tw-shadow);
 }
 
+sl-menu-item::part(base) {
+	width: 100%;
+}
+
 .ProseMirror p.is-editor-empty:first-child::before {
 	color: #adb5bd;
 	content: attr(data-placeholder);

inlang/source-code/ide-extension/CHANGELOG.md

@@ -1,5 +1,17 @@
 # inlang-vs-code-extension
 
+## 1.45.0
+
+### Minor Changes
+
+- 9e2125b: default human ids in sherlock
+
+## 1.44.16
+
+### Patch Changes
+
+- fadd94d: project selection focus on name instead of paths
+
 ## 1.44.15
 
 ### Patch Changes

inlang/source-code/ide-extension/README.md

@@ -228,6 +228,18 @@ You can disable inline annotations by setting the following property to `false`
 "sherlock.inlineAnnotations.enabled": false
 ```
 
+### Disable Auto Human ID Generation
+
+You can disable the automatic generation of human IDs by setting the following property to `false` in your VS Code `settings.json` file. The default value is `true`.
+
+```json
+"sherlock.extract.autoHumanId.enabled": false
+```
+
+> [!NOTE]  
+> Tip: It's best practice to use random names for your messages. Read this [guide](https://inlang.com/documentation/concept/message#idhuman-readable) for more information.
+
+
 #### Troubleshooting
 
 If you are having trouble with the **loading icon** not disappearing, this is a known issue & we are working with Visual Studio Code to fix it. In the meantime, you can right-click the Inlang icon to hide it:

inlang/source-code/ide-extension/docs/customization.md

@@ -46,4 +46,15 @@ You can disable inline annotations by setting the following property to `false`
 
 ```json
 "sherlock.inlineAnnotations.enabled": false
-```
+```
+
+## Disable Auto Human ID Generation
+
+You can disable the automatic generation of human IDs by setting the following property to `false` in your VS Code `settings.json` file. The default value is `true`.
+
+```json
+"sherlock.extract.autoHumanId.enabled": false
+```
+
+> [!NOTE]  
+> Tip: It's best practice to use random names for your messages. Read this [guide](https://inlang.com/documentation/concept/message#idhuman-readable) for more information.

inlang/source-code/ide-extension/package.json

@@ -10,7 +10,7 @@
 		"url": "https://github.com/opral/monorepo.git"
 	},
 	"icon": "assets/sherlock-logo.png",
-	"version": "1.44.15",
+	"version": "1.45.0",
 	"engines": {
 		"vscode": "^1.84.2"
 	},
@@ -193,6 +193,20 @@
 						}
 					}
 				},
+				"sherlock.extract": {
+					"type": "object",
+					"properties": {
+						"autoHumanId": {
+							"type": "object",
+							"properties": {
+								"enabled": {
+									"type": "boolean",
+									"default": true
+								}
+							}
+						}
+					}
+				},
 				"sherlock.inlineAnnotations.enabled": {
 					"type": "boolean",
 					"default": true