fix repository search for existing repository connected to a GitLab s…

…erver with many repositories

td.server/src/controllers/threatmodelcontroller.js

@@ -10,17 +10,18 @@ const repos = (req, res) => responseWrapper.sendResponseAsync(async () => {
     const repository = repositories.get();
 
     const page = req.query.page || 1;
+    const searchQuerys = req.query.searchQuery || [];
     let reposResp;
     let repos;
     // backwardly compatible with previous use of env vars GITHUB_USE_SEARCH and GITHUB_SEARCH_QUERY
     if (env.get().config.REPO_USE_SEARCH === 'true' || env.get().config.GITHUB_USE_SEARCH === 'true') {
         logger.debug('Using searchAsync');
         const searchQuery = env.get().config.REPO_SEARCH_QUERY ?? env.get().config.GITHUB_SEARCH_QUERY;
-        reposResp = await repository.searchAsync(page, req.provider.access_token, searchQuery);
+        reposResp = await repository.searchAsync(page, req.provider.access_token, [searchQuery, ...searchQuerys]);
         repos = reposResp[0].items ?? reposResp[0];
     } else {
         logger.debug('Using reposAsync');
-        reposResp = await repository.reposAsync(page, req.provider.access_token);
+        reposResp = await repository.reposAsync(page, req.provider.access_token, [searchQuerys]);
         repos = reposResp[0];
     }
     const headers = reposResp[1];

td.server/src/repositories/bitbucketrepo.js

@@ -22,10 +22,10 @@ export const getClient = (accessToken) => {
     return BitbucketClientWrapper.getClient(clientOptions);
 };
 
-export const reposAsync = async (page, accessToken) => {
+export const reposAsync = async (page, accessToken, searchQuerys = []) => {
     //Migrated
     const workspace = env.get().config.BITBUCKET_WORKSPACE;
-    const repos = await getClient(accessToken).repositories.list({workspace: workspace, page: page, pagelen: 10});
+    const repos = await getClient(accessToken).repositories.list({workspace: workspace, page: page, pagelen: 10, q: searchQuerys.join(' AND ')});
 
     const responseRepos = repos.data.values.map((x) => {
         const newX = {};
@@ -41,10 +41,10 @@ const hasNextPage = (response) => response.data.next !== undefined && response.d
 const hasPreviousPage = (response) => response.data.previous !== undefined && response.data.previous !== null;
 
 //Migrate searchAsync required
-const searchAsync = (page, accessToken, searchQuery) => getClient(accessToken).search().
+const searchAsync = (page, accessToken, searchQuerys) => getClient(accessToken).search().
 reposAsync({
     page: page,
-    q: searchQuery
+    q: searchQuerys
 });
 
 export const userAsync = (accessToken) => getClient(accessToken).users.getAuthedUser();

td.server/src/repositories/githubrepo.js

@@ -20,8 +20,8 @@ const getClient = (accessToken) => {
 const reposAsync = (page, accessToken) => getClient(accessToken).me().
 reposAsync(page);
 
-const searchAsync = (page, accessToken, searchQuery) => getClient(accessToken).search().
-    reposAsync({ page: page, q: searchQuery });
+const searchAsync = (page, accessToken, searchQuerys= []) => getClient(accessToken).search().
+    reposAsync({ page: page, q: searchQuerys });
 
 const userAsync = async (accessToken) => {
 

td.server/src/repositories/gitlabrepo.js

@@ -23,7 +23,7 @@ export const getClient = (accessToken) => {
     return GitlabClientWrapper.getClient(clientOptions.auth);
 };
 
-export const reposAsync = (page, accessToken) => searchAsync(page, accessToken, undefined);
+export const reposAsync = (page, accessToken, searchQuerys = []) => searchAsync(page, accessToken, searchQuerys);
 
 export const getPagination = (paginationInfo, page) => {
     const pagination = {page, next: false, prev: false};
@@ -36,8 +36,8 @@ export const getPagination = (paginationInfo, page) => {
     return pagination;
 };
 
-export const searchAsync = async (page, accessToken, searchQuery) => {
-    const repos = await getClient(accessToken).Projects.all({page: page, membership: true, showExpanded: true, search: searchQuery});
+export const searchAsync = async (page, accessToken, searchQuerys = []) => {
+    const repos = await getClient(accessToken).Projects.all({page: page, membership: true, showExpanded: true, search: searchQuerys.join('&')});
     repos.data.map((repo) => {
         repo.full_name = repo.path_with_namespace;
         return repo;

td.vue/src/components/SelectionPage.vue

@@ -17,7 +17,7 @@
                             <b-form-group id="filter-group">
                                 <b-form-input
                                     id="filter"
-                                    v-model="filter"
+                                    v-model="localFilter"
                                     :placeholder="$t('forms.search')"
                                 ></b-form-input>
                             </b-form-group>
@@ -36,7 +36,7 @@
                         @click="onBackClick">
                         ...
                     </b-list-group-item>
-                    
+
                     <b-list-group-item
                         v-if="items.length === 0 && !!emptyStateText"
                         @click="onEmptyStateClick"
@@ -54,29 +54,42 @@
                 </b-list-group>
             </b-col>
         </b-row>
-        
+
         <b-row>
             <b-col md=6 offset=3>
                 <div class="pagination">
                     <button @click="paginate(--pageRef)" :disabled="!pagePrev">Previous</button>
-                    <button class="btn" data-toggle="buttons" disabled="true">{{pageRef}}</button>
+                    <button class="btn" data-toggle="buttons" :disabled="true">{{pageRef}}</button>
                     <button @click="paginate(++pageRef)" :disabled="!pageNext">Next</button>
                 </div>
             </b-col>
         </b-row>
-    </b-container>    
+    </b-container>
 </template>
 
 <script>
 export default {
     name: 'TdSelectionPage',
     data() {
         return {
-            filter: '',
-            pageRef: this.page
+            pageRef: this.page,
+            localFilter: this.filter
         };
     },
+    watch: {
+        filter(newFilter) {
+            this.localFilter = newFilter;
+        },
+        localFilter(newFilter) {
+            this.$emit('update:filter', newFilter);
+        }
+    },
     props: {
+        filter: {
+            required: false,
+            type: String,
+            default: ''
+        },
         items: {
             required: true
         },

td.vue/src/service/api/threatmodelApi.js

@@ -22,13 +22,16 @@ const organisationAsync = () => api.getAsync(`${resource}/organisation`);
  * Gets the repos for the given user
  * @returns {Promise}
  */
-const reposAsync = (page = 1) => {
-    return api.getAsync(`${resource}/repos`, { params: { page: page } });
+const reposAsync = (page = 1, searchQuery = '') => {
+    return api.getAsync(`${resource}/repos`, {
+        params: { page: page, searchQuery: searchQuery },
+    });
 };
 
 /**
  * Gets the branches for the given repository
  * @param {String} fullRepoName
+ * @param {Number} page
  * @returns {Promise}
  */
 const branchesAsync = (fullRepoName, page = 1) => {

td.vue/src/store/modules/repository.js

@@ -26,10 +26,10 @@ const state = {
 
 const actions = {
     [REPOSITORY_CLEAR]: ({ commit }) => commit(REPOSITORY_CLEAR),
-    [REPOSITORY_FETCH]: async ({ commit, dispatch }, page=1) => {
+    [REPOSITORY_FETCH]: async ({ commit, dispatch }, {page, searchQuery}) => {
         dispatch(REPOSITORY_CLEAR);
-        const resp = await threatmodelApi.reposAsync(page);
-        commit(REPOSITORY_FETCH, { 
+        const resp = await threatmodelApi.reposAsync(page, searchQuery);
+        commit(REPOSITORY_FETCH, {
             'repos': resp.data.repos,
             'page': resp.data.pagination.page,
             'pageNext': resp.data.pagination.next,

td.vue/src/views/git/BranchAccess.vue

@@ -6,7 +6,7 @@
         :pagePrev="pagePrev"
         :onItemClick="onBranchClick"
         :paginate="paginate">
-        
+
         {{ $t('branch.select') }}
         <!-- Fixme: The href should get the configured hostname from env -->
         <a
@@ -42,15 +42,15 @@ export default {
         providerType: (state) => getProviderType(state.provider.selected),
         providerUri: (state) => state.provider.providerUri,
         repoName: (state) => state.repo.selected,
-        page: (state) => state.branch.page,
+        page: (state) => Number(state.branch.page),
         pageNext: (state) => state.branch.pageNext,
         pagePrev: (state) => state.branch.pagePrev
     }),
     mounted() {
         if (this.provider !== this.$route.params.provider) {
             this.$store.dispatch(providerActions.selected, this.$route.params.provider);
         }
-        
+
         if (this.repoName !== this.$route.params.repository) {
             this.$store.dispatch(repoActions.selected, this.$route.params.repository);
         }

td.vue/src/views/git/RepositoryAccess.vue

@@ -1,5 +1,6 @@
 <template>
     <td-selection-page
+        :filter.sync="searchQuery"
         :items="repositories"
         :page="page"
         :pageNext="pageNext"
@@ -24,14 +25,32 @@ export default {
     components: {
         TdSelectionPage
     },
+    data() {
+        return {
+            searchQuery: '',
+            searchTimeout: null,
+        };
+    },
     computed: mapState({
         provider: (state) => state.provider.selected,
         providerType: (state) => getProviderType(state.provider.selected),
         repositories: (state) => state.repo.all,
-        page: (state) => state.repo.page,
+        page: (state) => Number(state.repo.page),
         pageNext: (state) => state.repo.pageNext,
         pagePrev: (state) => state.repo.pagePrev
     }),
+    watch: {
+        searchQuery(newQuery) {
+            clearTimeout(this.searchTimeout);
+            this.searchTimeout = setTimeout(() => {
+                console.log('Suche nach:', newQuery);
+                this.$store.dispatch(repoActions.fetch, {
+                    page: 1,
+                    searchQuery: newQuery,
+                });
+            }, 500);
+        },
+    },
     mounted() {
         if (this.provider !== this.$route.params.provider) {
             this.$store.dispatch(providerActions.selected, this.$route.params.provider);
@@ -52,7 +71,7 @@ export default {
             this.$router.push({ name: `${this.providerType}Branch`, params, query: this.$route.query });
         },
         paginate(page) {
-            this.$store.dispatch(repoActions.fetch, page);
+            this.$store.dispatch(repoActions.fetch, page, this.searchQuery);
         }
     }
 };

td.vue/tests/unit/service/api/threatmodelApi.spec.js

@@ -23,7 +23,7 @@ describe('service/threatmodelApi.js', () => {
         });
 
         it('calls the repos endpoint', () => {
-            expect(api.getAsync).toHaveBeenCalledWith('/api/threatmodel/repos', {'params': {'page': 1}});
+            expect(api.getAsync).toHaveBeenCalledWith('/api/threatmodel/repos', {'params': {'page': 1, 'searchQuery': ''}});
         });
     });