Refactor the client to implement a channel navbar #76

Open
twig wants to merge 23 commits from navbar into main
5 changed files with 11 additions and 11 deletions
Showing only changes of commit 5ce236c936 - Show all commits

View file

@ -31,9 +31,9 @@
</template>
<script lang="ts" setup>
import type { NavbarInterface, NavbarItem } from '~/types/interfaces';
import type { INavbar, NavbarItem } from '~/types/interfaces';
const props = defineProps<NavbarInterface>();
const props = defineProps<INavbar>();
const runtimeConfig = useRuntimeConfig();
const defaultIcon = `${runtimeConfig.app.baseURL}/icon.svg`

View file

@ -48,14 +48,14 @@ import Loading from '~/components/Popups/Loading.vue';
import Button from '~/components/UserInterface/Button.vue';
import Navbar from '~/components/UserInterface/Navbar.vue';
import VerticalSpacer from '~/components/UserInterface/VerticalSpacer.vue';
import type { GuildResponse, NavbarInterface, NavbarItem } from '~/types/interfaces';
import type { GuildResponse, INavbar, NavbarItem } from '~/types/interfaces';
definePageMeta({
keepalive: true
});
const loading = useState("loading", () => false);
const navbar = useState<NavbarInterface>("navbar")
const navbar = useState<INavbar>("navbar")
const createButtonContainer = ref<HTMLButtonElement>();
twig marked this conversation as resolved Outdated

This should be an anchor element, not a button

This should be an anchor element, not a button

disagree, i'd like to put an inbox here, that would be a popup, not a link

disagree, i'd like to put an inbox here, that would be a popup, not a link

Right but I think all clickable elements that lead you to an external site should be anchor elements. Here I'm specifically talking about the source code element.

Right but I think all clickable elements that lead you to an external site should be anchor elements. Here I'm specifically talking about the source code element.

sure, i'm reworking it anyways

sure, i'm reworking it anyways
@ -163,7 +163,7 @@ onMounted(() => {
helpItem
],
channelItems: [] // set by the channel
} as NavbarInterface
} as INavbar
}
})

View file

@ -36,12 +36,12 @@ import ChannelEntry from "~/components/Guild/ChannelEntry.vue";
import GuildOptionsMenu from "~/components/Guild/GuildOptionsMenu.vue";
import MemberEntry from "~/components/Guild/MemberEntry.vue";
import ResizableSidebar from "~/components/UserInterface/ResizableSidebar.vue";
import type { ChannelResponse, GuildMemberResponse, GuildResponse, NavbarInterface } from "~/types/interfaces";
import type { ChannelResponse, GuildMemberResponse, GuildResponse, INavbar } from "~/types/interfaces";
const route = useRoute();
const loading = useState("loading");
const navbar = useState<NavbarInterface>("navbar");
const navbar = useState<INavbar>("navbar");
const channelUrlPath = `channels/${route.params.channelId}`;

View file

@ -129,7 +129,7 @@ export interface NavbarItem {
callback: (...args: any[]) => any;
}
export interface NavbarInterface {
export interface INavbar {
clientItems?: NavbarItem[]
channelItems?: NavbarItem[] // search bar will require some changes
contextName?: string

View file

@ -1,10 +1,10 @@
import type { NavbarInterface, NavbarOptions } from "~/types/interfaces";
import type { INavbar, NavbarOptions } from "~/types/interfaces";
const navbar = useState<NavbarInterface>("navbar")
const navbar = useState<INavbar>("navbar")
export default async (options: NavbarOptions) => {
await nextTick()
if (navbar.value) {
if (options.guild) {
navbar.value.channelItems = []