started implementing organizationFolder-settings view, subresources are not listed in resource-settings view

src/components/CreateResourceButton.vue

@@ -0,0 +1,26 @@
+<script setup>
+import { ref } from "vue";
+import { NcActions, NcActionInput } from '@nextcloud/vue';
+
+import Folder from "vue-material-design-icons/Folder.vue";
+import Plus from "vue-material-design-icons/Plus.vue";
+
+import api from "../api.js";
+import { validResourceName } from "../helpers/validation.js";
+
+const emit = defineEmits(["create"]);
+
+const newFolderResourceName = ref("");
+</script>
+<template>
+    <NcActions type="secondary">
+        <template #icon>
+            <Plus :size="20" />
+        </template>
+        <NcActionInput v-model="newFolderResourceName" :label-outside="true" label="Ordner hinzufügen" @submit="emit('create', api.ResourceTypes.FOLDER, newFolderResourceName)">
+            <template #icon>
+                <Folder :size="20" />
+            </template>
+        </NcActionInput>
+    </NcActions>
+</template>

src/components/MemberList/ResourceMembersList.vue

@@ -113,7 +113,7 @@ const deleteMember = (memberId) => {
 				</tr>
 				<tr v-if="!loading && !members.length">
 					<td colspan="4" style="grid-column-start: 1; grid-column-end: 5">
-						<NcEmptyContent title="Keine Mitglieder" />
+						<NcEmptyContent name="Keine Mitglieder" />
 					</td>
 				</tr>
 				<MemberListItem v-for="member in members"

src/components/ResourceList.vue

@@ -0,0 +1,87 @@
+<script setup>
+import { computed, ref } from "vue";
+import { NcListItem, NcTextField, NcEmptyContent } from '@nextcloud/vue';
+
+import Magnify from "vue-material-design-icons/Magnify.vue";
+import CheckboxBlankCircle from "vue-material-design-icons/CheckboxBlankCircle.vue";
+import Folder from "vue-material-design-icons/Folder.vue";
+import FolderOff from "vue-material-design-icons/FolderOff.vue";
+
+import api from "../api.js";
+
+const emit = defineEmits(["click:resource"]);
+
+const props = defineProps({
+	resources: {
+		type: Array,
+		required: true,
+	},
+    enableSearch: {
+        type: Boolean,
+        default: false,
+    }
+});
+
+const search = ref("");
+
+const filteredResources = computed(() => props.resources.filter((g) => g.name.toLowerCase().includes(search.value.toLowerCase())))
+</script>
+
+<template>
+	<div>
+        <NcTextField v-if="props.enableSearch"
+            :value.sync="search"
+			label="Suche..."
+			class="search-input"
+			trailing-button-icon="close"
+			:show-trailing-button="search !== ''"
+			@trailing-button-click="search = ''">
+			<Magnify :size="16" />
+		</NcTextField>
+		<NcEmptyContent v-if="resources.length === 0" name="Keine Unter-Resourcen vorhanden">
+            <template #icon>
+                <FolderOff />
+            </template>
+        </NcEmptyContent>
+		<ul v-else>
+			<NcListItem v-for="resource in filteredResources"
+				:key="resource.id"
+				class="resource-list material_you"
+				:name="resource.name"
+				:linkAriaLabel="resource.name"
+				:force-display-actions="true"
+				@click="() => emit('click:resource', resource)">
+				<template #icon>
+					<Folder v-if="resource.type === api.ResourceTypes.FOLDER" :size="44" />
+				</template>
+				<template #indicator>
+					<CheckboxBlankCircle v-tooltip="resource.active ? 'aktiviert' : 'nicht aktiviert'" :size="16" :fill-color="resource.active ? 'var(--color-primary)' : '#333'" />
+				</template>
+				<template #actions>
+					actions
+				</template>
+			</NcListItem>
+		</ul>
+	</div>
+</template>
+
+<style scoped>
+.search-input {
+	width: 100%;
+	border: 1px solid #666;
+	margin-bottom: 10px;
+}
+
+/* center the indicator icon for folder active state " */
+.resource-list {
+	position: relative;
+}
+
+/deep/ .resource-list .line-two__additional_elements {
+	position: absolute;
+	top: calc(50% - 8px);
+	right: 25px;
+	margin: 0;
+	height: 20px;
+}
+</style>