<template>
    <div class="content">
        <Room v-for="(room, index) in rooms()" :key="index" :room="room" />
    </div>
</template>

<script>
import { mapGetters } from "vuex";
import Room from "./Room";

export default {
    name: "Rooms",
    props: {},
    components: {
        Room,
    },
    computed: {
        ...mapGetters(["rooms"]),
    },
};
</script>

<style scoped>
.content {
    display: flex;
    flex-direction: column;
    background-color: var(--secondary-background);
    overflow: auto;
}
</style>
