From f06c4103a08d8229bca4db760a9f3817b3550521 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Mon, 26 Jun 2023 13:03:40 +0200
Subject: [PATCH 1/4] Init

---
 ...t-search-list-add-highligthed-file-content |  7 +++
 package.json                                  |  2 +-
 .../components/FilesList/ResourceTable.vue    |  1 +
 .../src/components/Search/List.vue            | 21 ++++++-
 packages/web-app-files/src/search/sdk/list.ts | 17 ++++-
 .../web-client/src/webdav/constants/dav.ts    |  1 +
 pnpm-lock.yaml                                | 63 ++++++++++---------
 7 files changed, 78 insertions(+), 34 deletions(-)
 create mode 100644 changelog/unreleased/enhancement-search-list-add-highligthed-file-content

diff --git a/changelog/unreleased/enhancement-search-list-add-highligthed-file-content b/changelog/unreleased/enhancement-search-list-add-highligthed-file-content
new file mode 100644
index 00000000000..84e367a116f
--- /dev/null
+++ b/changelog/unreleased/enhancement-search-list-add-highligthed-file-content
@@ -0,0 +1,7 @@
+Enhancement: Search list add highlighted file content
+
+We've introduced a feature that shows a highlighted result summary matching the search term in the search list,
+if there are occurrences in the fount files.
+
+https://github.com/owncloud/web/pull/9294
+https://github.com/owncloud/web/issues/9295
diff --git a/package.json b/package.json
index 5d572a10f2c..8998f677d9d 100644
--- a/package.json
+++ b/package.json
@@ -83,7 +83,7 @@
     "cucumber-html-reporter": "5.5.1",
     "depcheck": "1.4.3",
     "ejs": "3.1.9",
-    "eslint": "8.40.0",
+    "eslint": "8.43.0",
     "flush-promises": "1.0.2",
     "git-repo-info": "2.1.1",
     "jest": "29.5.0",
diff --git a/packages/web-app-files/src/components/FilesList/ResourceTable.vue b/packages/web-app-files/src/components/FilesList/ResourceTable.vue
index 401a6de4126..26a759b6ac7 100644
--- a/packages/web-app-files/src/components/FilesList/ResourceTable.vue
+++ b/packages/web-app-files/src/components/FilesList/ResourceTable.vue
@@ -79,6 +79,7 @@
           <oc-icon name="edit-2" fill-type="line" size="small" />
         </oc-button>
       </div>
+      <slot name="additionalResourceContent" :resource="item" />
     </template>
     <template #status="{ item }">
       <!-- @slot Status column -->
diff --git a/packages/web-app-files/src/components/Search/List.vue b/packages/web-app-files/src/components/Search/List.vue
index 3342b292d92..6a5e71b673a 100644
--- a/packages/web-app-files/src/components/Search/List.vue
+++ b/packages/web-app-files/src/components/Search/List.vue
@@ -61,10 +61,18 @@
           :is-selectable="true"
           :sort-by="sortBy"
           :sort-dir="sortDir"
+          :fields-displayed="['name', 'size', 'tags', 'mdate']"
           @file-click="triggerDefaultAction"
           @row-mounted="rowMounted"
           @sort="handleSort"
         >
+          <template #additionalResourceContent="{ resource }">
+            <span
+              v-if="resource.highlights"
+              class="files-search-resource-highlights oc-text-truncate"
+              v-html="resource.highlights"
+            />
+          </template>
           <template #contextMenu="{ resource }">
             <context-actions
               v-if="isResourceInSelection(resource)"
@@ -373,4 +381,15 @@ export default defineComponent({
   }
 })
 </script>
-<style lang="scss"></style>
+<style lang="scss">
+.files-search-resource-highlights {
+  font-size: 0.8125rem;
+  color: var(--oc-color-text-muted);
+
+  mark {
+    background: var(--oc-color-background-highlight);
+    font-style: normal;
+    font-weight: var(--oc-font-weight-semibold);
+  }
+}
+</style>
diff --git a/packages/web-app-files/src/search/sdk/list.ts b/packages/web-app-files/src/search/sdk/list.ts
index 67bd9e782c4..c062454acdc 100644
--- a/packages/web-app-files/src/search/sdk/list.ts
+++ b/packages/web-app-files/src/search/sdk/list.ts
@@ -1,13 +1,22 @@
 import { SearchList, SearchResult } from 'web-app-search/src/types'
 import ListComponent from '../../components/Search/List.vue'
 import { ClientService } from 'web-pkg/src/services'
-import { ProjectSpaceResource, buildResource, isProjectSpaceResource } from 'web-client/src/helpers'
+import {
+  ProjectSpaceResource,
+  buildResource,
+  isProjectSpaceResource,
+  Resource
+} from 'web-client/src/helpers'
 import { Component, computed, Ref, unref } from 'vue'
 import { DavProperties, DavProperty } from 'web-client/src/webdav/constants'
 import { Store } from 'vuex'
 
 export const searchLimit = 200
 
+export interface SearchResource extends Resource {
+  highlights: string[]
+}
+
 export default class List implements SearchList {
   public readonly component: Component
   private readonly store: Store<any>
@@ -45,7 +54,11 @@ export default class List implements SearchList {
       totalResults: range ? parseInt(range?.split('/')[1]) : null,
       values: results.map((result) => {
         const matchingSpace = this.getMatchingSpace(result.fileInfo[DavProperty.FileParent])
-        const resource = matchingSpace ? matchingSpace : buildResource(result)
+        const resource = {
+          ...(matchingSpace ? matchingSpace : buildResource(result)),
+          highlights: result.fileInfo[DavProperty.Highlights] || ''
+        } as SearchResource
+
         // info: in oc10 we have no storageId in resources. All resources are mounted into the personal space.
         if (!resource.storageId) {
           resource.storageId = this.store.getters.user.id
diff --git a/packages/web-client/src/webdav/constants/dav.ts b/packages/web-client/src/webdav/constants/dav.ts
index 40120e6997b..f1e6d718ec1 100644
--- a/packages/web-client/src/webdav/constants/dav.ts
+++ b/packages/web-client/src/webdav/constants/dav.ts
@@ -28,6 +28,7 @@ export abstract class DavProperty {
   static readonly MimeType: string = '{DAV:}getcontenttype'
   static readonly ResourceType: string = '{DAV:}resourcetype'
   static readonly DownloadURL: string = '{http://owncloud.org/ns}downloadURL'
+  static readonly Highlights: string = '{http://owncloud.org/ns}highlights'
 
   static readonly ShareId: string = '{http://owncloud.org/ns}shareid'
   static readonly ShareRoot: string = '{http://owncloud.org/ns}shareroot'
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index aa3c9a97ee2..ad07d048687 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -160,8 +160,8 @@ importers:
         specifier: 3.1.9
         version: 3.1.9
       eslint:
-        specifier: 8.40.0
-        version: 8.40.0
+        specifier: 8.43.0
+        version: 8.43.0
       flush-promises:
         specifier: 1.0.2
         version: 1.0.2
@@ -489,7 +489,7 @@ importers:
         version: 4.1.3
       vue-styleguidist:
         specifier: ^4.44.2
-        version: 4.54.3(@vue/compiler-sfc@3.3.4)(eslint@8.40.0)(vue-loader@15.10.1)(vue@3.3.4)(webpack@4.46.0)
+        version: 4.54.3(@vue/compiler-sfc@3.3.4)(eslint@8.43.0)(vue-loader@15.10.1)(vue@3.3.4)(webpack@4.46.0)
       vue3-gettext:
         specifier: ^2.3.3
         version: 2.3.4(@vue/compiler-sfc@3.3.4)(vue@3.3.4)
@@ -5348,13 +5348,13 @@ packages:
       eslint-visitor-keys: 3.4.1
     dev: false
 
-  /@eslint-community/eslint-utils@4.3.0(eslint@8.40.0):
+  /@eslint-community/eslint-utils@4.3.0(eslint@8.43.0):
     resolution: {integrity: sha512-v3oplH6FYCULtFuCeqyuTd9D2WKO937Dxdq+GmHOLL72TTRriLxz2VLlNfkZRsvj6PKnOPAtuT6dwrs/pA5DvA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
       eslint: ^6.0.0 || ^7.0.0 || >=8.0.0
     dependencies:
-      eslint: 8.40.0
+      eslint: 8.43.0
       eslint-visitor-keys: 3.4.1
     dev: true
 
@@ -5368,7 +5368,7 @@ packages:
     dependencies:
       ajv: 6.12.6
       debug: 4.3.4(supports-color@6.1.0)
-      espree: 9.4.0
+      espree: 9.5.2
       globals: 13.19.0
       ignore: 5.2.4
       import-fresh: 3.3.0
@@ -5396,8 +5396,8 @@ packages:
       - supports-color
     dev: true
 
-  /@eslint/js@8.40.0:
-    resolution: {integrity: sha512-ElyB54bJIhXQYVKjDSvCkPO1iU1tSAeVQJbllWJq1XQSmmA4dgFk8CbiBGpiOPxleE48vDogxCtmMYku4HSVLA==}
+  /@eslint/js@8.43.0:
+    resolution: {integrity: sha512-s2UHCoiXfxMvmfzqoN+vrQ84ahUSYde9qNO1MdxmoEhyHWsfmwOpFlwYV+ePJEVc7gFnATGUi376WowX1N7tFg==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dev: true
 
@@ -5422,8 +5422,8 @@ packages:
       - supports-color
     dev: false
 
-  /@humanwhocodes/config-array@0.11.8:
-    resolution: {integrity: sha512-UybHIJzJnR5Qc/MsD9Kr+RpO2h+/P1GhOwdiLPXK5TWk5sgTdu88bTD9UP+CKbPPh5Rni1u0GjAdYQLemG8g+g==}
+  /@humanwhocodes/config-array@0.11.10:
+    resolution: {integrity: sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ==}
     engines: {node: '>=10.10.0'}
     dependencies:
       '@humanwhocodes/object-schema': 1.2.1
@@ -11305,16 +11305,16 @@ packages:
       - supports-color
     dev: false
 
-  /eslint@8.40.0:
-    resolution: {integrity: sha512-bvR+TsP9EHL3TqNtj9sCNJVAFK3fBN8Q7g5waghxyRsPLIMwL73XSKnZFK0hk/O2ANC+iAoq6PWMQ+IfBAJIiQ==}
+  /eslint@8.43.0:
+    resolution: {integrity: sha512-aaCpf2JqqKesMFGgmRPessmVKjcGXqdlAYLLC3THM8t5nBRZRQ+st5WM/hoJXkdioEXLLbXgclUpM0TXo5HX5Q==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     hasBin: true
     dependencies:
-      '@eslint-community/eslint-utils': 4.3.0(eslint@8.40.0)
+      '@eslint-community/eslint-utils': 4.3.0(eslint@8.43.0)
       '@eslint-community/regexpp': 4.4.0
       '@eslint/eslintrc': 2.0.3
-      '@eslint/js': 8.40.0
-      '@humanwhocodes/config-array': 0.11.8
+      '@eslint/js': 8.43.0
+      '@humanwhocodes/config-array': 0.11.10
       '@humanwhocodes/module-importer': 1.0.1
       '@nodelib/fs.walk': 1.2.8
       ajv: 6.12.6
@@ -11333,13 +11333,12 @@ packages:
       find-up: 5.0.0
       glob-parent: 6.0.2
       globals: 13.19.0
-      grapheme-splitter: 1.0.4
+      graphemer: 1.4.0
       ignore: 5.2.4
       import-fresh: 3.3.0
       imurmurhash: 0.1.4
       is-glob: 4.0.3
       is-path-inside: 3.0.3
-      js-sdsl: 4.1.5
       js-yaml: 4.1.0
       json-stable-stringify-without-jsonify: 1.0.1
       levn: 0.4.1
@@ -11370,7 +11369,6 @@ packages:
       acorn: 8.8.1
       acorn-jsx: 5.3.2(acorn@8.8.1)
       eslint-visitor-keys: 3.4.1
-    dev: true
 
   /esprima@2.7.3:
     resolution: {integrity: sha512-OarPfz0lFCiW4/AV2Oy1Rp9qu0iusTKqykwTspGCZtPxmF81JR4MmIebvF1F9+UOKth2ZubLQ4XGGaU+hSn99A==}
@@ -11395,7 +11393,6 @@ packages:
     engines: {node: '>=0.10'}
     dependencies:
       estraverse: 5.2.0
-    dev: true
 
   /esrecurse@4.3.0:
     resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
@@ -11927,7 +11924,7 @@ packages:
     resolution: {integrity: sha512-j0KLYPhm6zeac4lz3oJ3o65qvgQCcPubiyotZrXqEaG4hNagNYO8qdlUrX5vwqv9ohqeT/Z3j6+yW067yWWdUw==}
     dev: true
 
-  /fork-ts-checker-webpack-plugin@6.5.2(eslint@8.40.0)(typescript@4.8.4)(webpack@4.46.0):
+  /fork-ts-checker-webpack-plugin@6.5.2(eslint@8.43.0)(typescript@4.8.4)(webpack@4.46.0):
     resolution: {integrity: sha512-m5cUmF30xkZ7h4tWUgTAcEaKmUW7tfyUyTqNNOz7OxWJ0v1VWKTcOvH8FWHUwSjlW/356Ijc9vi3XfcPstpQKA==}
     engines: {node: '>=10', yarn: '>=1.0.0'}
     peerDependencies:
@@ -11947,7 +11944,7 @@ packages:
       chokidar: 3.5.3
       cosmiconfig: 6.0.0
       deepmerge: 4.2.2
-      eslint: 8.40.0
+      eslint: 8.43.0
       fs-extra: 9.1.0
       glob: 7.2.0
       memfs: 3.4.12
@@ -12350,6 +12347,11 @@ packages:
 
   /grapheme-splitter@1.0.4:
     resolution: {integrity: sha512-bzh50DW9kTPM00T8y4o8vQg89Di9oLJVLW/KaOGIXJWP/iqCN6WKYkbNOF04vFLJhwcpYUh9ydh/+5vpOqV4YQ==}
+    dev: false
+
+  /graphemer@1.4.0:
+    resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
+    dev: true
 
   /growl@1.10.5:
     resolution: {integrity: sha512-qBr4OuELkhPenW6goKVXiv47US3clb3/IbuWF9KNKEijAy9oeHxU9IgzjvJhHkUzhaj7rOUD7+YGWqUjLp5oSA==}
@@ -14044,6 +14046,7 @@ packages:
 
   /js-sdsl@4.1.5:
     resolution: {integrity: sha512-08bOAKweV2NUC1wqTtf3qZlnpOX/R2DU9ikpjOHs0H+ibQv3zpncVQg6um4uYtRtrwIX8M4Nh3ytK4HGlYAq7Q==}
+    dev: false
 
   /js-stringify@1.0.2:
     resolution: {integrity: sha512-rtS5ATOo2Q5k1G+DADISilDA6lv79zIiwFd6CcjuIxGKLFm5C+RLImRscVap9k55i+MOZwgliw+NejvkLuGD5g==}
@@ -17412,7 +17415,7 @@ packages:
       react: 18.2.0
     dev: true
 
-  /react-dev-utils@12.0.1(eslint@8.40.0)(typescript@4.8.4)(webpack@4.46.0):
+  /react-dev-utils@12.0.1(eslint@8.43.0)(typescript@4.8.4)(webpack@4.46.0):
     resolution: {integrity: sha512-84Ivxmr17KjUupyqzFode6xKhjwuEJDROWKJy/BthkL7Wn6NJ8h4WE6k/exAv6ImS+0oZLRRW5j/aINMHyeGeQ==}
     engines: {node: '>=14'}
     peerDependencies:
@@ -17431,7 +17434,7 @@ packages:
       escape-string-regexp: 4.0.0
       filesize: 8.0.7
       find-up: 5.0.0
-      fork-ts-checker-webpack-plugin: 6.5.2(eslint@8.40.0)(typescript@4.8.4)(webpack@4.46.0)
+      fork-ts-checker-webpack-plugin: 6.5.2(eslint@8.43.0)(typescript@4.8.4)(webpack@4.46.0)
       global-modules: 2.0.0
       globby: 11.1.0
       gzip-size: 6.0.0
@@ -17556,7 +17559,7 @@ packages:
       react-dom: 18.2.0(react@18.2.0)
     dev: true
 
-  /react-styleguidist@11.2.0(eslint@8.40.0)(react-dom@18.2.0)(react@18.2.0)(typescript@4.8.4)(webpack@4.46.0):
+  /react-styleguidist@11.2.0(eslint@8.43.0)(react-dom@18.2.0)(react@18.2.0)(typescript@4.8.4)(webpack@4.46.0):
     resolution: {integrity: sha512-iiq4fRgsZGQLdRWx76R3G9CmEsQkitWRCJKdL5Sh6RktFLYvfvrmBfX7bE7KazF2YrJtsxGlmhsE4WpChXECNA==}
     engines: {node: '>=14'}
     hasBin: true
@@ -17611,7 +17614,7 @@ packages:
       q-i: 2.0.1
       qss: 2.0.3
       react: 18.2.0
-      react-dev-utils: 12.0.1(eslint@8.40.0)(typescript@4.8.4)(webpack@4.46.0)
+      react-dev-utils: 12.0.1(eslint@8.43.0)(typescript@4.8.4)(webpack@4.46.0)
       react-docgen: 5.4.3
       react-docgen-annotation-resolver: 2.0.0
       react-docgen-displayname-handler: 3.0.2(react-docgen@5.4.3)
@@ -20526,8 +20529,8 @@ packages:
       eslint: 8.25.0
       eslint-scope: 7.2.0
       eslint-visitor-keys: 3.4.1
-      espree: 9.4.0
-      esquery: 1.4.0
+      espree: 9.5.2
+      esquery: 1.5.0
       lodash: 4.17.21
       semver: 7.3.8
     transitivePeerDependencies:
@@ -20723,7 +20726,7 @@ packages:
       loader-utils: 1.4.0
     dev: true
 
-  /vue-styleguidist@4.54.3(@vue/compiler-sfc@3.3.4)(eslint@8.40.0)(vue-loader@15.10.1)(vue@3.3.4)(webpack@4.46.0):
+  /vue-styleguidist@4.54.3(@vue/compiler-sfc@3.3.4)(eslint@8.43.0)(vue-loader@15.10.1)(vue@3.3.4)(webpack@4.46.0):
     resolution: {integrity: sha512-9uv7xexWI6dFWQlhDv491S8sKpuymhT3QvxfnwSrvc3V70Zmp6uWBG48NAXGJIaQc6xQpi9Llv5DSHhyNFlxcg==}
     engines: {node: '>=6', npm: '>=3'}
     hasBin: true
@@ -20782,13 +20785,13 @@ packages:
       qss: 2.0.3
       react: 18.2.0
       react-codemirror2: 7.2.1(codemirror@5.65.10)(react@18.2.0)
-      react-dev-utils: 12.0.1(eslint@8.40.0)(typescript@4.8.4)(webpack@4.46.0)
+      react-dev-utils: 12.0.1(eslint@8.43.0)(typescript@4.8.4)(webpack@4.46.0)
       react-dom: 18.2.0(react@18.2.0)
       react-group: 3.0.2(react@18.2.0)
       react-icons: 3.11.0(react@18.2.0)
       react-lifecycles-compat: 3.0.4
       react-simple-code-editor: 0.13.1(react-dom@18.2.0)(react@18.2.0)
-      react-styleguidist: 11.2.0(eslint@8.40.0)(react-dom@18.2.0)(react@18.2.0)(typescript@4.8.4)(webpack@4.46.0)
+      react-styleguidist: 11.2.0(eslint@8.43.0)(react-dom@18.2.0)(react@18.2.0)(typescript@4.8.4)(webpack@4.46.0)
       rewrite-imports: 2.0.3
       source-map: 0.7.4
       style-loader: 1.3.0(webpack@4.46.0)

From 85d28287eecd5673bc68713a0f12d78f43e0536d Mon Sep 17 00:00:00 2001
From: Jan <jackermann@owncloud.com>
Date: Tue, 27 Jun 2023 16:07:18 +0200
Subject: [PATCH 2/4] Update
 changelog/unreleased/enhancement-search-list-add-highligthed-file-content

Co-authored-by: Jannik Stehle <50302941+JammingBen@users.noreply.github.com>
---
 .../enhancement-search-list-add-highligthed-file-content        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/changelog/unreleased/enhancement-search-list-add-highligthed-file-content b/changelog/unreleased/enhancement-search-list-add-highligthed-file-content
index 84e367a116f..5549aaadc27 100644
--- a/changelog/unreleased/enhancement-search-list-add-highligthed-file-content
+++ b/changelog/unreleased/enhancement-search-list-add-highligthed-file-content
@@ -1,7 +1,7 @@
 Enhancement: Search list add highlighted file content
 
 We've introduced a feature that shows a highlighted result summary matching the search term in the search list,
-if there are occurrences in the fount files.
+if there are occurrences in the found files.
 
 https://github.com/owncloud/web/pull/9294
 https://github.com/owncloud/web/issues/9295

From edea1031864c87517eb88d62e9ef7dc08af9373c Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 28 Jun 2023 10:17:59 +0200
Subject: [PATCH 3/4] Fix

---
 packages/web-app-files/src/search/sdk/list.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/web-app-files/src/search/sdk/list.ts b/packages/web-app-files/src/search/sdk/list.ts
index c062454acdc..6e467f0b21c 100644
--- a/packages/web-app-files/src/search/sdk/list.ts
+++ b/packages/web-app-files/src/search/sdk/list.ts
@@ -14,7 +14,7 @@ import { Store } from 'vuex'
 export const searchLimit = 200
 
 export interface SearchResource extends Resource {
-  highlights: string[]
+  highlights: string
 }
 
 export default class List implements SearchList {

From 6ebe68955492a0f9109f8dc4006277cde712289a Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 28 Jun 2023 12:00:59 +0200
Subject: [PATCH 4/4] Styling

---
 packages/web-app-files/src/components/Search/List.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/web-app-files/src/components/Search/List.vue b/packages/web-app-files/src/components/Search/List.vue
index 6a5e71b673a..6e2dcaeaa70 100644
--- a/packages/web-app-files/src/components/Search/List.vue
+++ b/packages/web-app-files/src/components/Search/List.vue
@@ -28,7 +28,7 @@
         </item-filter>
         <item-filter-toggle
           v-if="fullTextSearchEnabled"
-          :filter-label="$gettext('Search in file content')"
+          :filter-label="$gettext('Search only in content')"
           filter-name="fullText"
           class="files-search-filter-full-text oc-mr-s"
         />
@@ -387,7 +387,7 @@ export default defineComponent({
   color: var(--oc-color-text-muted);
 
   mark {
-    background: var(--oc-color-background-highlight);
+    background: #fff74c;
     font-style: normal;
     font-weight: var(--oc-font-weight-semibold);
   }