diff --git a/src/utils/thumbnail.test.ts b/src/utils/thumbnail.test.ts
new file mode 100644
index 0000000..4847024
--- /dev/null
+++ b/src/utils/thumbnail.test.ts
@@ -0,0 +1,16 @@
+import { describe, expect, it } from "vitest";
+import { fixture } from "../../tests/helper/fs";
+import { Thumbnail } from "./thumbnail";
+
+describe("thumbnail Smoke Test", () => {
+    it("should return localized package thumbnail", async () => {
+        const thumbnail = await Thumbnail.create(fixture("oo_project_1"), [], "en");
+
+        const data = await thumbnail?.provideThumbnail();
+
+        expect(data).toEqual(expect.objectContaining({
+            title: "Project 1",
+            description: "This is the description for Project 1.",
+        }));
+    });
+});
diff --git a/src/utils/thumbnail.ts b/src/utils/thumbnail.ts
index 01bdc8f..279d931 100644
--- a/src/utils/thumbnail.ts
+++ b/src/utils/thumbnail.ts
@@ -278,7 +278,7 @@ export class Thumbnail implements ThumbnailProvider {
 
     async provideThumbnail(): Promise<PackageThumbnail | undefined> {
         const result: PackageThumbnail = {
-            title: this.wsPkgData.packageName,
+            title: this.wsPkgData.displayName,
             icon: this.wsPkgData.icon,
             description: this.wsPkgData.description,
             flows: await this._provideFlowsThumbnail(),
@@ -343,7 +343,7 @@ export class Thumbnail implements ThumbnailProvider {
     private async _provideFlowsThumbnail(): Promise<FlowThumbnail[]> {
         const result: FlowThumbnail[] = [];
         const flowsDir = path.join(this.wsPkgData.packageDir, "flows");
-        const flowNames = await fs.readdir(flowsDir);
+        const flowNames = await fs.readdir(flowsDir).catch(() => []);
         for (const flowName of flowNames) {
             const flowData = await FlowLikeData.create(this.wsPkgData, flowName, path.join(flowsDir, flowName), "flow");
             if (flowData) {
@@ -563,7 +563,7 @@ class PkgData {
 
     public readonly searchPaths: string[];
 
-    public readonly title: string | undefined;
+    public readonly displayName: string | undefined;
     public readonly description: string | undefined;
     public readonly icon: string | undefined;
     public readonly blocksOrder: string[] | undefined;
@@ -582,8 +582,8 @@ class PkgData {
     ) {
         this.searchPaths = depsQuery.searchPaths;
         this.icon = this.resolveResourceURI(data.icon, packageDir);
-        this.title = data.title || data.name;
-        this.description = data.description;
+        this.displayName = this.localize(data.displayName) || data.name;
+        this.description = this.localize(data.description);
         this.blocksOrder = data.ui?.blocks;
         this.dependencies = isPlainObject(data.dependencies) ? data.dependencies : {};
     }
diff --git a/tests/fixtures/oo_project_1/oo-locales/en.json b/tests/fixtures/oo_project_1/oo-locales/en.json
new file mode 100644
index 0000000..8944a80
--- /dev/null
+++ b/tests/fixtures/oo_project_1/oo-locales/en.json
@@ -0,0 +1,4 @@
+{
+  "displayName": "Project 1",
+  "description": "This is the description for Project 1."
+}
diff --git a/tests/fixtures/oo_project_1/package.oo.yaml b/tests/fixtures/oo_project_1/package.oo.yaml
new file mode 100644
index 0000000..ebfa49c
--- /dev/null
+++ b/tests/fixtures/oo_project_1/package.oo.yaml
@@ -0,0 +1,4 @@
+name: project-1
+version: 1.0.0
+displayName: "%displayName%"
+description: "%description%"