<commit_before><template>
	<div
		id="chat-container"
		class="window">
		<div
			id="chat"
			:data-id="channel.id"
			:class="{
				'hide-motd': !settings.motd,
				'hide-status-messages': settings.statusMessages === 'hidden',
				'condensed-status-messages': settings.statusMessages === 'condensed',
				'colored-nicks': settings.coloredNicks,
				'show-seconds': settings.showSeconds,
			}"
		>
			<div
				:id="'chan-' + channel.id"
				:class="[channel.type, 'chan', 'active']"
				:data-id="channel.id"
				:data-type="channel.type"
				:aria-label="channel.name"
				role="tabpanel"
			>
				<div class="header">
					<button
						class="lt"
						aria-label="Toggle channel list"/>
					<span class="title">{{ channel.name }}</span>
					<span
						:title="channel.topic"
						class="topic"
						v-html="$options.filters.parse(channel.topic)"/>
					<button
						class="menu"
						aria-label="Open the context menu"
					/>
					<span
						v-if="channel.type === 'channel'"
						class="rt-tooltip tooltipped tooltipped-w"
						aria-label="Toggle user list">
						<button
							class="rt"
							aria-label="Toggle user list"/>
					</span>
				</div>
				<div
					v-if="channel.type === 'special'"
					class="chat-content">
					<component
						:is="specialComponent"
						:channel="channel"/>
				</div>
				<div
					v-else
					class="chat-content">
					<div
						ref="chat"
						class="chat"
					>
						<div class="show-more">
							<button
								ref="loadMoreButton"
								:disabled="channel.historyLoading || !$root.connected"
								class="btn"
								@click="onShowMoreClick"
							>
								<span v-if="channel.historyLoading">Loading…</span>
								<span v-else>Show older messages</span>
							</button>
						</div>
						<MessageList :channel="channel"/>
					</div>
					<ChatUserList
						v-if="channel.type === 'channel'"
						:channel="channel"/>
				</div>
			</div>
		</div>
		<div id="connection-error"/>
		<ChatInput
			:network="network"
			:channel="channel"/>
	</div>
</template>

<script>
require("intersection-observer");
const socket = require("../js/socket");
import MessageList from "./MessageList.vue";
import ChatInput from "./ChatInput.vue";
import ChatUserList from "./ChatUserList.vue";
import ListBans from "./Special/ListBans.vue";
import ListChannels from "./Special/ListChannels.vue";

export default {
	name: "Chat",
	components: {
		MessageList,
		ChatInput,
		ChatUserList,
	},
	props: {
		settings: Object,
		network: Object,
		channel: Object,
	},
	computed: {
		specialComponent() {
			switch (this.channel.special) {
			case "list_bans": return ListBans;
			case "list_channels": return ListChannels;
			}
		},
	},
	watch: {
		"channel.messages"() {
			const el = this.$refs.chat;

			if (!el) {
				return;
			}

			if (el.scrollHeight - el.scrollTop - el.offsetHeight > 30) {
				return;
			}
<commit_msg>Fix history not loading on channel switch<commit_after><template>
	<div
		id="chat-container"
		class="window">
		<div
			id="chat"
			:data-id="channel.id"
			:class="{
				'hide-motd': !settings.motd,
				'hide-status-messages': settings.statusMessages === 'hidden',
				'condensed-status-messages': settings.statusMessages === 'condensed',
				'colored-nicks': settings.coloredNicks,
				'show-seconds': settings.showSeconds,
			}"
		>
			<div
				:id="'chan-' + channel.id"
				:class="[channel.type, 'chan', 'active']"
				:data-id="channel.id"
				:data-type="channel.type"
				:aria-label="channel.name"
				role="tabpanel"
			>
				<div class="header">
					<button
						class="lt"
						aria-label="Toggle channel list"/>
					<span class="title">{{ channel.name }}</span>
					<span
						:title="channel.topic"
						class="topic"
						v-html="$options.filters.parse(channel.topic)"/>
					<button
						class="menu"
						aria-label="Open the context menu"
					/>
					<span
						v-if="channel.type === 'channel'"
						class="rt-tooltip tooltipped tooltipped-w"
						aria-label="Toggle user list">
						<button
							class="rt"
							aria-label="Toggle user list"/>
					</span>
				</div>
				<div
					v-if="channel.type === 'special'"
					class="chat-content">
					<component
						:is="specialComponent"
						:channel="channel"/>
				</div>
				<div
					v-else
					class="chat-content">
					<div
						ref="chat"
						class="chat"
					>
						<div class="show-more">
							<button
								ref="loadMoreButton"
								:disabled="channel.historyLoading || !$root.connected"
								class="btn"
								@click="onShowMoreClick"
							>
								<span v-if="channel.historyLoading">Loading…</span>
								<span v-else>Show older messages</span>
							</button>
						</div>
						<MessageList :channel="channel"/>
					</div>
					<ChatUserList
						v-if="channel.type === 'channel'"
						:channel="channel"/>
				</div>
			</div>
		</div>
		<div id="connection-error"/>
		<ChatInput
			:network="network"
			:channel="channel"/>
	</div>
</template>

<script>
require("intersection-observer");
const socket = require("../js/socket");
import MessageList from "./MessageList.vue";
import ChatInput from "./ChatInput.vue";
import ChatUserList from "./ChatUserList.vue";
import ListBans from "./Special/ListBans.vue";
import ListChannels from "./Special/ListChannels.vue";

export default {
	name: "Chat",
	components: {
		MessageList,
		ChatInput,
		ChatUserList,
	},
	props: {
		settings: Object,
		network: Object,
		channel: Object,
	},
	computed: {
		specialComponent() {
			switch (this.channel.special) {
			case "list_bans": return ListBans;
			case "list_channels": return ListChannels;
			}
		},
	},
	watch: {
		"channel.id"() {
			if (this.$refs.loadMoreButton) {
				this.$nextTick(() => {
					const bounding = this.$refs.loadMoreButton.getBoundingClientRect();

					if (bounding.top >= 0) {
						this.$refs.loadMoreButton.click();
					}
				});
			}
		},
		"channel.messages"() {
			const el = this.$refs.chat;

			if (!el) {
				return;
			}

			if (el.scrollHeight - el.scrollTop - el.offsetHeight > 30) {
				return;
			}

{'fraction_non_alphanumeric': 0.17144741180349488, 'fraction_numerical': 0.0008242664029014178, 'mean_word_length': 2.694884287454324, 'pattern_counts': {'":': 4, '<': 79, '<?xml version=': 0, '>': 83, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6856321', 'n_tokens_mistral': 2728, 'n_tokens_neox': 1984, 'n_words': 377}