diff --git a/ee/app/assets/javascripts/logs/list_index.vue b/ee/app/assets/javascripts/logs/list_index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..8c910709e1c95562f7315ea7f890de270273b10d
--- /dev/null
+++ b/ee/app/assets/javascripts/logs/list_index.vue
@@ -0,0 +1,23 @@
+<script>
+import ProvisionedObservabilityContainer from '~/observability/components/provisioned_observability_container.vue';
+
+export default {
+  components: {
+    ProvisionedObservabilityContainer,
+  },
+  props: {
+    apiConfig: {
+      type: Object,
+      required: true,
+    },
+  },
+};
+</script>
+
+<template>
+  <provisioned-observability-container :api-config="apiConfig">
+    <template #default>
+      <!-- TODO Implement List UI -->
+    </template>
+  </provisioned-observability-container>
+</template>
diff --git a/ee/app/assets/javascripts/pages/projects/logs/index/index.js b/ee/app/assets/javascripts/pages/projects/logs/index/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..8de5f2833eb90eb1a09420ce71cd822c082bd05d
--- /dev/null
+++ b/ee/app/assets/javascripts/pages/projects/logs/index/index.js
@@ -0,0 +1,4 @@
+import ListIndex from 'ee/logs/list_index.vue';
+import { initSimpleApp } from '~/helpers/init_simple_app_helper';
+
+initSimpleApp('#js-observability-logs', ListIndex);
diff --git a/ee/spec/frontend/logs/list_index_spec.js b/ee/spec/frontend/logs/list_index_spec.js
new file mode 100644
index 0000000000000000000000000000000000000000..58e872aada4223ac4f959d31d2db309b2425065e
--- /dev/null
+++ b/ee/spec/frontend/logs/list_index_spec.js
@@ -0,0 +1,32 @@
+import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
+import ListIndex from 'ee/logs/list_index.vue';
+import ProvisionedObservabilityContainer from '~/observability/components/provisioned_observability_container.vue';
+
+describe('ListIndex', () => {
+  const props = {
+    apiConfig: {
+      oauthUrl: 'https://example.com/oauth',
+      tracingUrl: 'https://example.com/tracing',
+      provisioningUrl: 'https://example.com/provisioning',
+      servicesUrl: 'https://example.com/services',
+      operationsUrl: 'https://example.com/operations',
+      metricsUrl: 'https://example.com/metricsUrl',
+    },
+  };
+
+  let wrapper;
+
+  const mountComponent = () => {
+    wrapper = shallowMountExtended(ListIndex, {
+      propsData: props,
+    });
+  };
+
+  it('renders provisioned-observability-container component', () => {
+    mountComponent();
+
+    const observabilityContainer = wrapper.findComponent(ProvisionedObservabilityContainer);
+    expect(observabilityContainer.exists()).toBe(true);
+    expect(observabilityContainer.props('apiConfig')).toStrictEqual(props.apiConfig);
+  });
+});