feat: server management in app (#5628)
* start new server settings tabs * update properties tab to match design * better stying in general tab * feat: add suffix input for hostname field * implement tables for allocations and DNS records * add tags for dns record type * small gap adjustment * polish advanced page * adjust properties page hierarchy * fix searching properties, empty state and projection radius appearing * pnpm prepr * update copy to match designs * fix suffix input component * style fixes and match heading size * small fix * fix search allocations placeholder * adjust table styles * move all installation settings helper text to below input * update icon to use overflow menu buttons * fix modal to be consistent * open advanced properties when search * remove other and custom properties, and update styles * remove hide/show all java versions * handle mc 26 * refactor: move server settings pages into /ui and add app ServerSettingsModal * hook up server pages for app * add server page header to app * hook up server settings modal * use large size * fix card box shadow style * fix hostname input for app * fix app/website card containers * implement external tabs for billing and admin billing * fix save banner fixed to parent instead of page body * remove unused prop to FriendsList causing warning in app * fix client-only not available for app * fix bottom cut off * wire node auth * implement full copy buttons * dedup copy button tailwind styles * fix hover class not working in @apply * fix spacing * fix error validation styles * apply consistent styles and spacing * feat: update hosting server card (#5609) * fix type errors * fix some stylesheets not imported for storybook * add server listing stories * add fix for frontend stylesheet imports * remove props. * convert copy code to use tailwind * update server listing component styles * update server info label styles * start status/player count info label, more style updates and fixes * add new server card buttons * hook up server cards and implement updated styles * hook up on download button * fix tauri throwing error when api returns 204 No Content * hook up purchase server modal in app * fix upgrading state loading icon * pnpm prepr * filter out servers past 30 days after cancellation * do not apply opacity on lock or spiner icons * fix disabled server icon background * update pending change stage * handle known suspension states * refactor: reduce code duplication for server listing * update disabled state text color * fix loading icon color * clean up copy * fix disabled opacity for server card * update server listing files kept to be countdown * implement resubscribe modal * implement proper provisioning state for resubscribe * fix duplicate attribute and pnpm prepr * feat: add shared UI package auth DI * feat: update purchase server flow (#5714) * implement server list empty state component * fix stories and adjust spacing * implement select plan design refresh * implement auth for empty server list * use refs instead of reactive * pnpm prepr * fix auth usage for empty servers list * move app auth provider setup to src/providers/setup * pnpm prepr * fix max height * style fix * fix getCreds no auth is blocking api client * implement servers guest plan modal and signin which redirects back to modal's next step * refactor guest plan select logic into provider * implement sign in or create account popup * remove force empty serverList * add download button for suspended mod and generic * add handling for when user logs out * QA pass style fixes * more consistent page styles * fix duplicate export * refactor: remove all fallback stuff from resubscribe modal * implement shared download latest backup util * i18n pass * pnpm prepr * fix region being selected if ping failed * pnpm prepr * feat: servers in app finalization (#5744) * feat: start on shared console implementation into logs and overview pages * fix: terminal gap issues * feat: swap word wrap for full screen * fix: stats cards alignment * fix: stats * feat: fix console clear + remove copy * fix: lint * fix: use reset not clear * feat: shared server header & overview page for app and website (#5736) * feat: implement shared server header for app and website * feat: implement wrapped overview page with shared composable and hook it up * pnpm prepr * fix: bugs * qa: cleanup * feat: root.vue shared layout * feat: delete old options pages + fix discovery frontend * fix: discovery * fix: misc style/layout issues * fix page padding * fix: modal height jankiness * feat: implement server install content in app and server setup modal with DI * fix: spacing * remove servers in app feature flag * Revert "remove servers in app feature flag" This reverts commit 86e284c4bdd6fa42c3c8fbaf1efbec41f4d1c6d2. * fix: qa * feat: remove legacy components from apps/frontend/src/components/ui/servers --------- Co-authored-by: Calum H. (IMB11) <contact@cal.engineer> * qa pass (#5738) * fix: qa * feat: qa * fix: server icon fetch fails due to global node auth race condition overriding each other * fix: lint * fix: server icon upload/sync and centralize logic * fix: server settings modal not closing for server reset * fix: better server sorting * feat: copy address in server listing card * fix: notification panel in modal and when overlapping with action bar * fix: empty server list empty state flashing when refresh, fixed by adding isReady auth flag * feat: use floating action bar for save banner * fix: saving state in save bar * fix: edit server icon styling * fix: confirm modal to have consistent buttons * feat: loading animation for server panel + caching improvements for app * pnpm prepr * feat: search page deduplication (#5754) * fix: action bar behind modal * fix: remove warning modal for stopping * fix: server cards states * we hate webkit we hate webkit * fix: update allocation creation to not use modal * fix: properties tab spacing and styles * feat: add files tab copy * fix: advanced properties icon * fix: remove back to all servers link * feat: add files tab link in copy * fix: server header styles to be consistent with instance * fix: add header icons back * feat: update instance settings icon to be consistent * fix: icon container * feat: upload state persistence across tabs * fix: server labels text wrapping * fix: use surface-5 border * fix: loading spinner showing with onboarding below * feat: new server button shows purchase modal in website * fix: billing page not showing quarterly interval * fix: server downgrade not showing updated subscription notification * fix: server settings invalidate saved state and remove server context provider since its already provided in the page * pnpm prepr * add stripe publishable key to app build * feat: console highlighting * fix: rename servers title to modrinth hosting * feat: search fix * fix: qa/styles * fix: ip click active and remove power dont ask again * fix: qa * feat: highlighting fix console * fix: disable conflicts action * fix: error dismiss bug * feat: modal clarification * fix: files perms issue * fix: lint * feat: modal fix * enable show uptime * fix: add loading state to edit server icon * fix: notification panel take in has sidebar from settings * fix: consistency pass on app settings * fix: consistency pass on instance settings * pnpm prepr * fix: nagivate to billing button in app to go to website * fix: stripe return url in app causing app to open modrinth.com in tauri * refactor: better show polling UI code * fix: new server polling comparison to use server ids instead of length * fix: buttonstyled story * fix: button styling * fix: content.vue regression * feat: project url redirects * fix: breadcrumbs * fix: purchase with newly added card * fix: console ordering problems * fix: app-frontend missing env config and staging environment * fix: log syncing for instances and server panel accidentally * fix: QA issues * fix: server page loading state * fix: stats card logic * fix: lint * fix: qa * fix: console height padding * fix: terminal padding + loading indicator * feat: update medal server listing styling * fix: no upgrade button for medal server listing in app * fix: go to overview instead of content tab after onboarding * fix: qa * fix: teleport modals to body * fix: logs tab + qa * fix: local storage for user preferences * fix: qa loading indic * feat: considitonal debug and trace * fix: jump to top on install bug * feat: swap out server hard drive icon to server stack icon * feat: servers in app feature flag default true * fix: highlight row ufll * fix: webkit thing onto a tag * fix: input field * fix: clear fix * fix: lint * fix: fmt * feat: improve share modal and bring it back for sharing log * pnpm prepr * fix: menu overflowing * feat: remove servers in app feature flag * fix: server stat charts no longer showing color * fix: library nav no primary state * fix: better modal height and width * fix: highlighting bugs * fix: empty states * fix: delay import to fix overview page slow load on MacOS * fix: medal server listing too bright on light mode * fix: admon analysis + fix logs * fix: bug * fix: clear purchase intent from sign-in after closing modal * performance: improve server manage stats loading by splitting reactivity * fix: deploy + admon + disable highlighting * fix: clippy --------- Co-authored-by: tdgao <mr.trumgao@gmail.com> Co-authored-by: Truman Gao <106889354+tdgao@users.noreply.github.com> * feat: temp wrangler * fix: lint * fix: logs upload * fix: console empty state and admon regressions * fix: fields * feat: log deleting + prefetch for Logs.vue * feat: move delete before share * feat: clear endpoint * feat: we ball! --------- Co-authored-by: Calum H. <calum@modrinth.com> Co-authored-by: Calum H. (IMB11) <contact@cal.engineer>
This commit is contained in:
Truman Gao
@@ -1,164 +1 @@
|
||||
import { createGlobalState } from '@vueuse/core'
|
||||
import { type Ref, shallowRef } from 'vue'
|
||||
|
||||
/**
|
||||
* Maximum number of console output lines to store
|
||||
* @type {number}
|
||||
*/
|
||||
const maxLines = 10000
|
||||
const batchTimeout = 300 // ms
|
||||
const initialBatchSize = 256
|
||||
|
||||
/**
|
||||
* Provides a global console output state management system
|
||||
* Allows adding, storing, and clearing console output with a maximum line limit
|
||||
*
|
||||
* @returns {Object} Console state management methods and reactive state
|
||||
* @property {Ref<string[]>} consoleOutput - Reactive array of console output lines
|
||||
* @property {function(string): void} addConsoleOutput - Method to add a new console output line
|
||||
* @property {function(): void} clear - Method to clear all console output
|
||||
*/
|
||||
export const useModrinthServersConsole = createGlobalState(() => {
|
||||
/**
|
||||
* Reactive array storing console output lines
|
||||
* @type {Ref<string[]>}
|
||||
*/
|
||||
const output: Ref<string[]> = shallowRef<string[]>([])
|
||||
const searchQuery: Ref<string> = shallowRef('')
|
||||
const filteredOutput: Ref<string[]> = shallowRef([])
|
||||
let searchRegex: RegExp | null = null
|
||||
|
||||
let lineBuffer: string[] = []
|
||||
let batchTimer: NodeJS.Timeout | null = null
|
||||
let isProcessingInitialBatch = false
|
||||
|
||||
let refilterTimer: NodeJS.Timeout | null = null
|
||||
const refilterTimeout = 100 // ms
|
||||
|
||||
const updateFilter = () => {
|
||||
if (!searchQuery.value) {
|
||||
filteredOutput.value = []
|
||||
return
|
||||
}
|
||||
|
||||
if (!searchRegex) {
|
||||
searchRegex = new RegExp(searchQuery.value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'i')
|
||||
}
|
||||
|
||||
filteredOutput.value = output.value.filter((line) => searchRegex?.test(line) ?? false)
|
||||
}
|
||||
|
||||
const scheduleRefilter = () => {
|
||||
if (refilterTimer) clearTimeout(refilterTimer)
|
||||
refilterTimer = setTimeout(updateFilter, refilterTimeout)
|
||||
}
|
||||
|
||||
const flushBuffer = () => {
|
||||
if (lineBuffer.length === 0) return
|
||||
|
||||
const processedLines = lineBuffer.flatMap((line) => line.split('\n').filter(Boolean))
|
||||
|
||||
if (isProcessingInitialBatch && processedLines.length >= initialBatchSize) {
|
||||
isProcessingInitialBatch = false
|
||||
output.value = processedLines.slice(-maxLines)
|
||||
} else {
|
||||
const newOutput = [...output.value, ...processedLines]
|
||||
output.value = newOutput.slice(-maxLines)
|
||||
}
|
||||
|
||||
lineBuffer = []
|
||||
batchTimer = null
|
||||
|
||||
if (searchQuery.value) {
|
||||
scheduleRefilter()
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds a new output line to the console output
|
||||
* Automatically removes the oldest line if max output is exceeded
|
||||
*
|
||||
* @param {string} line - The console output line to add
|
||||
*/
|
||||
const addLine = (line: string): void => {
|
||||
lineBuffer.push(line)
|
||||
|
||||
if (!batchTimer) {
|
||||
batchTimer = setTimeout(flushBuffer, batchTimeout)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds multiple output lines to the console output
|
||||
* Automatically removes the oldest lines if max output is exceeded
|
||||
*
|
||||
* @param {string[]} lines - The console output lines to add
|
||||
* @returns {void}
|
||||
*/
|
||||
const addLines = (lines: string[]): void => {
|
||||
if (output.value.length === 0 && lines.length >= initialBatchSize) {
|
||||
isProcessingInitialBatch = true
|
||||
lineBuffer = lines
|
||||
flushBuffer()
|
||||
return
|
||||
}
|
||||
|
||||
lineBuffer.push(...lines)
|
||||
|
||||
if (!batchTimer) {
|
||||
batchTimer = setTimeout(flushBuffer, batchTimeout)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets the search query and filters the output based on the query
|
||||
*
|
||||
* @param {string} query - The search query
|
||||
*/
|
||||
const setSearchQuery = (query: string): void => {
|
||||
searchQuery.value = query
|
||||
searchRegex = null
|
||||
updateFilter()
|
||||
}
|
||||
|
||||
/**
|
||||
* Clears all console output lines
|
||||
*/
|
||||
const clear = (): void => {
|
||||
output.value = []
|
||||
filteredOutput.value = []
|
||||
searchQuery.value = ''
|
||||
lineBuffer = []
|
||||
isProcessingInitialBatch = false
|
||||
if (batchTimer) {
|
||||
clearTimeout(batchTimer)
|
||||
batchTimer = null
|
||||
}
|
||||
if (refilterTimer) {
|
||||
clearTimeout(refilterTimer)
|
||||
refilterTimer = null
|
||||
}
|
||||
searchRegex = null
|
||||
}
|
||||
|
||||
/**
|
||||
* Finds the index of a line in the main output
|
||||
*
|
||||
* @param {string} line - The line to find
|
||||
* @returns {number} The index of the line, or -1 if not found
|
||||
*/
|
||||
const findLineIndex = (line: string): number => {
|
||||
return output.value.findIndex((l) => l === line)
|
||||
}
|
||||
|
||||
return {
|
||||
output,
|
||||
searchQuery,
|
||||
filteredOutput,
|
||||
addLine,
|
||||
addLines,
|
||||
setSearchQuery,
|
||||
clear,
|
||||
findLineIndex,
|
||||
}
|
||||
})
|
||||
export { useModrinthServersConsole } from '@modrinth/ui'
|
||||
|
||||
Reference in New Issue
Block a user