14175184225

Committed 31 Mar 2025 03:21PM UTC coverage: 97.407% (-0.8%) from 98.157%

Build # 14175184225

Build Type

push

github

Committed by

super3

Commit Message

Add MultiChannel

Run Details

86 of 90 branches covered (95.56%)

Branch coverage included in aggregate %.

53 of 54 new or added lines in 5 files covered. (98.15%)

2 existing lines in 2 files now uncovered.

177 of 180 relevant lines covered (98.33%)

5.19 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

98.85

/src/components/DirectMessageSidebar.vue

<template>
  <div class="bg-indigo-darker text-purple-lighter flex-none w-64 pb-6 hidden md:block">
    <div class="text-white mb-2 mt-3 px-4 flex justify-between">
      <div class="flex-auto">
        <h1 class="font-semibold text-xl leading-tight mb-1 truncate">nilo.chat</h1>
        <div class="flex items-center mb-6">
          <span :class="[isConnected ? 'bg-green-500' : 'border border-white', 'rounded-full block w-2 h-2 mr-2']"></span>
          <span class="text-white/50 text-sm">{{ username }}</span>
        </div>
      </div>
    </div>
    
    <!-- Channels section -->
    <div class="mb-8">
      <div class="px-4 mb-2 text-white flex items-center">
        <div @click="toggleChannels" class="cursor-pointer w-4 mr-2 flex justify-center">
          <svg v-if="showChannels" class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/>
          </svg>
          <svg v-else class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
          </svg>
        </div>
        <div class="opacity-75 flex-1">Channels</div>
        <div>
          <svg class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M11 9h4v2h-4v4H9v-4H5V9h4V5h2v4zm-1 11a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16z" />
          </svg>
        </div>
      </div>
      <div v-if="showChannels">
        <div 
          @click="switchChannel('general')" 
          class="px-4 py-1 text-white flex items-center cursor-pointer hover:bg-teal-darker"
          :class="{ 'bg-teal-dark': currentChannel === 'general' }"
        >
          <div class="w-4 mr-2 text-center">#</div>
          <span>general</span>
        </div>
        <div 
          @click="switchChannel('feedback')" 
          class="px-4 py-1 text-white flex items-center cursor-pointer hover:bg-teal-darker"
          :class="{ 'bg-teal-dark': currentChannel === 'feedback' }"
        >
          <div class="w-4 mr-2 text-center">#</div>
          <span>feedback</span>
        </div>
      </div>
    </div>
    
    <!-- Direct Messages section -->
    <div class="mb-8">
      <div class="px-4 mb-2 text-white flex items-center">
        <div @click="toggleDirectMessages" class="cursor-pointer w-4 mr-2 flex justify-center">
          <svg v-if="showDirectMessages" class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/>
          </svg>
          <svg v-else class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
          </svg>
        </div>
        <div class="opacity-75 flex-1">Direct Messages</div>
        <div>
          <svg class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path d="M11 9h4v2h-4v4H9v-4H5V9h4V5h2v4zm-1 11a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16z" />
          </svg>
        </div>
      </div>
      <div v-if="showDirectMessages">
        <div class="px-4 flex items-center mb-2" :class="{ 'opacity-50': !isConnected }">
          <div class="w-4 mr-2 flex justify-center">
            <span :class="[isConnected ? 'bg-green-500' : 'border border-white', 'rounded-full block w-2 h-2']"></span>
          </div>
          <span class="text-white opacity-75">{{ username }} <span class="text-gray-500 text-sm">(you)</span></span>
        </div>
        <div class="px-4 flex items-center mb-2">
          <div class="w-4 mr-2 flex justify-center">
            <span class="bg-green-500 rounded-full block w-2 h-2"></span>
          </div>
          <span class="text-white opacity-75">Steve_Nilo</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'DirectMessageSidebar',
  props: {
    username: {
      type: String,
      required: true
    },
    isConnected: {
      type: Boolean,
      default: false
    },
    currentChannel: {
      type: String,
      default: 'general'
    }
  },
  data() {
    return {
      showChannels: true,
      showDirectMessages: true
    }
  },
  methods: {
    toggleChannels() {
      this.showChannels = !this.showChannels;
    },
    toggleDirectMessages() {
      this.showDirectMessages = !this.showDirectMessages;
    },
    switchChannel(channel) {
      if (channel !== this.currentChannel) {
        this.$emit('channel-change', channel);
      }
    }
  }
}
</script> 

1	<template>
2	<div class="bg-indigo-darker text-purple-lighter flex-none w-64 pb-6 hidden md:block">
3	<div class="text-white mb-2 mt-3 px-4 flex justify-between">
4	<div class="flex-auto">	1✔
5	<h1 class="font-semibold text-xl leading-tight mb-1 truncate">nilo.chat</h1>
6	<div class="flex items-center mb-6">
7	<span :class="[isConnected ? 'bg-green-500' : 'border border-white', 'rounded-full block w-2 h-2 mr-2']"></span>	1✔
8	<span class="text-white/50 text-sm">{{ username }}</span>	1✔
9	</div>
10	</div>
11	</div>
12
13	<!-- Channels section -->
14	<div class="mb-8">
15	<div class="px-4 mb-2 text-white flex items-center">
16	<div @click="toggleChannels" class="cursor-pointer w-4 mr-2 flex justify-center">
17	<svg v-if="showChannels" class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
18	<path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/>
19	</svg>
20	<svg v-else class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
21	<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
22	</svg>
23	</div>
24	<div class="opacity-75 flex-1">Channels</div>
25	<div>	18✔
26	<svg class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
27	<path d="M11 9h4v2h-4v4H9v-4H5V9h4V5h2v4zm-1 11a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16z" />
28	</svg>
29	</div>
30	</div>
31	<div v-if="showChannels">
32	<div	3✔
33	@click="switchChannel('general')"
34	class="px-4 py-1 text-white flex items-center cursor-pointer hover:bg-teal-darker"
35	:class="{ 'bg-teal-dark': currentChannel === 'general' }"	3✔
36	>
37	<div class="w-4 mr-2 text-center">#</div>
38	<span>general</span>	3✔
39	</div>	2✔
40	<div
41	@click="switchChannel('feedback')"
42	class="px-4 py-1 text-white flex items-center cursor-pointer hover:bg-teal-darker"
43	:class="{ 'bg-teal-dark': currentChannel === 'feedback' }"
44	>	1✔
45	<div class="w-4 mr-2 text-center">#</div>
46	<span>feedback</span>	1✔
47	</div>
48	</div>
49	</div>	1✔
50		1✔
51	<!-- Direct Messages section -->	1✔
52	<div class="mb-8">
53	<div class="px-4 mb-2 text-white flex items-center">
54	<div @click="toggleDirectMessages" class="cursor-pointer w-4 mr-2 flex justify-center">	1✔
55	<svg v-if="showDirectMessages" class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
56	<path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/>
57	</svg>	1✔
58	<svg v-else class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
59	<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
60	</svg>	1✔
61	</div>
62	<div class="opacity-75 flex-1">Direct Messages</div>
63	<div>	1✔
64	<svg class="fill-current h-4 w-4 opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
65	<path d="M11 9h4v2h-4v4H9v-4H5V9h4V5h2v4zm-1 11a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16z" />
66	</svg>	1✔
67	</div>
68	</div>
69	<div v-if="showDirectMessages">	1✔
70	<div class="px-4 flex items-center mb-2" :class="{ 'opacity-50': !isConnected }">
71	<div class="w-4 mr-2 flex justify-center">
72	<span :class="[isConnected ? 'bg-green-500' : 'border border-white', 'rounded-full block w-2 h-2']"></span>	1✔
73	</div>
74	<span class="text-white opacity-75">{{ username }} <span class="text-gray-500 text-sm">(you)</span></span>
75	</div>
76	<div class="px-4 flex items-center mb-2">
77	<div class="w-4 mr-2 flex justify-center">
78	<span class="bg-green-500 rounded-full block w-2 h-2"></span>	1✔
79	</div>
80	<span class="text-white opacity-75">Steve_Nilo</span>
81	</div>
82	</div>
83	</div>
84	</div>	1✔
85	</template>
86
87	<script>	1✔
88	export default {
89	name: 'DirectMessageSidebar',
90	props: {	1✔
91	username: {
92	type: String,
93	required: true	1✔
94	},
95	isConnected: {
96	type: Boolean,
97	default: false
98	},
99	currentChannel: {	1✔
100	type: String,
101	default: 'general'
102	}
103	},
104	data() {
105	return {	1✔
106	showChannels: true,
107	showDirectMessages: true
108	}	1✔
109	},
110	methods: {
111	toggleChannels() {	1✔
112	this.showChannels = !this.showChannels;
113	},
114	toggleDirectMessages() {
115	this.showDirectMessages = !this.showDirectMessages;	30✔
116	},
117	switchChannel(channel) {
118	if (channel !== this.currentChannel) {	30✔
119	this.$emit('channel-change', channel);
120	}	1✔
121	}
122	}	71✔
123	}
124	</script>	12✔

super3 / nilo.chat / 14175184225

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous