👁️ qryn view

qryn-view is a smart and minimal LogQl, Metrics, Traces and Flux API data explorer developed in React/JS and designed for qryn

Features

Data Sources Settings

• URL, Headers
• Basic Auth
• Quick Setting (clone one setting for all datasources)
• Use for all (use current setting for all datasources)

Browsers:

• Logs
• Metrics
• Traces
• Flux (experimental)

Display:

• Logs & Charts
• Traces View
• Table view
• Link Logs with Traces
• Split data views
• Multi query execution
• Timerange Selector
• Query History
• Mobile View
• 100% Client-Side

---

Usage

Local development:

Clone Repo

git clone https://github.com/metrico/qryn-view

Install packages

pnpm install 

---

Local Build:

Build local clone

pnpm run build 

Install Serve (npm serve)

sudo npm i -g serve

serve -s ./packages/main/dist

---

Releases

check our Qryn View Releases

---

Use the public client (no data goes through the server) or build and run your own instance

Environment Variables:

• HOST default: 0.0.0.0

• PORT default: 8080

• API_URL default: http://localhost:3100

Example

~/$ HOST=localhost PORT=8080 API_URL=http://qryn-host:3100 pnpm dev

---

Available Routes

• qryn-view works under a hash router to make it flexible for static deployments and simpler to run over a single route.

Current available routes:

/#/datasources : Datasources settings

/#/search : Main search view

/#/users : users reserved route

/#/plugins : custom plugins

---

URL Parameters

qryn-view can be controlled globally through URL parameters_

param	description	default
start	timestamp Ns	now
stop	timestamp Ns
isEmbed	embed mode	false
theme	application theme	dark
left	left panel queries details
right	right panel queries details

---

Query Data (logql, metrics, traces, flux) inside left or right panel

JSON stringifyed and URL encoded

• id: - query ID
• idRef - Title for a query
• expr - query expression (neeeds to be URL encoded)
• limit - query limit
• dataSourceType - 'logs', 'metrics', 'traces', 'flux'.
• dataSourceURL - the datasource API URL.
• dataSourceId - Data Source Id inside Data Sources Setting

---

Local Proxy for headeless qryn-view (for experimentation purposes only):

Add to you .env file:

VITE_API_BASE_URL= { your local qryn api } should we with same protocol as your qryn-view instance

About qryn

Consult the qryn Wiki for a detailed list of the project and its supported features, changelog and API functionality

Acknowledgements

• (C) 2022 QXIP BV see LICENSE for details