mirror of https://github.com/BRAVO68WEB/shx.git
added markdown to dashboard homepage
This commit is contained in:
Chirag Bhalotia
parent
523d394c23
commit
628c0094ba
|
|
@ -1,9 +1,16 @@
|
|||
import Markdown from '@/components/Markdown';
|
||||
import axios from 'axios';
|
||||
import React from 'react';
|
||||
import showdown from 'showdown';
|
||||
let converter = new showdown.Converter();
|
||||
|
||||
const Dashboard = () => {
|
||||
const Dashboard = async () => {
|
||||
const { data } = await axios.get(
|
||||
'https://raw.githubusercontent.com/BRAVO68WEB/shx/dev/README.md'
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<h1 className="text-5xl">Dasbhboard</h1>
|
||||
<Markdown markdown={converter.makeHtml(data)} />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,19 +1,31 @@
|
|||
|
||||
*{
|
||||
margin:0;
|
||||
padding:0;
|
||||
box-sizing: border-box;
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
:root{
|
||||
--primary:#3A86FF;
|
||||
--secondary:#8338EC;
|
||||
:root {
|
||||
--primary: #3a86ff;
|
||||
--secondary: #8338ec;
|
||||
}
|
||||
|
||||
body{
|
||||
color:white
|
||||
body {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.markdown-body p:nth-child(3) {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.markdown-body p:nth-child(4) {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.markdown-body p:nth-child(5) {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@tailwind utilities;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
'use client';
|
||||
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import "github-markdown-css"
|
||||
|
||||
|
||||
interface MarkdownProps {
|
||||
markdown: string;
|
||||
}
|
||||
|
||||
function Markdown({ markdown }: MarkdownProps) {
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
useEffect(() => {
|
||||
if (ref.current?.innerHTML) ref.current.innerHTML = markdown;
|
||||
}, []);
|
||||
return (
|
||||
<div className="markdown-body w-full p-10" ref={ref}>
|
||||
Markdown
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default Markdown;
|
||||
|
|
@ -23,15 +23,19 @@
|
|||
"clsx": "^1.2.1",
|
||||
"eslint": "8.41.0",
|
||||
"eslint-config-next": "13.4.5",
|
||||
"github-markdown-css": "^5.2.0",
|
||||
"install": "^0.13.0",
|
||||
"js-cookie": "^3.0.5",
|
||||
"lucide-react": "^0.221.0",
|
||||
"next": "^13.4.7",
|
||||
"next-auth": "^4.22.1",
|
||||
"npm": "^9.7.2",
|
||||
"postcss": "8.4.24",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"react-hook-form": "^7.44.3",
|
||||
"react-hot-toast": "^2.4.1",
|
||||
"showdown": "^2.1.0",
|
||||
"tailwind-merge": "^1.12.0",
|
||||
"tailwindcss": "3.3.2",
|
||||
"typescript": "5.0.4",
|
||||
|
|
@ -46,6 +50,7 @@
|
|||
"@storybook/react": "^7.0.17",
|
||||
"@storybook/testing-library": "^0.0.14-next.2",
|
||||
"@types/js-cookie": "^3.0.3",
|
||||
"@types/showdown": "^2.0.1",
|
||||
"eslint-plugin-storybook": "^0.6.12",
|
||||
"storybook": "^7.0.17"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,194 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Welcome file</title>
|
||||
<link rel="stylesheet" href="https://stackedit.io/style.css" />
|
||||
</head>
|
||||
|
||||
<body class="stackedit">
|
||||
<div class="stackedit__html">
|
||||
<h1 id="🚀-project-shx">🚀 <strong>Project SHX</strong></h1>
|
||||
<p><img src="https://safe.b68dev.xyz/SHOJJQKU.png" alt="SHX Banner" /></p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/package-json/v/BRAVO68WEB/shx?logo=npm&style=for-the-badge"
|
||||
alt="GitHub package.json version"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/actions/workflow/status/bravo68web/shx/build-image.yaml?style=for-the-badge"
|
||||
alt="GitHub Workflow Status"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/last-commit/bravo68web/shx?style=for-the-badge"
|
||||
alt="GitHub last commit"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/languages/code-size/bravo68web/shx?style=for-the-badge"
|
||||
alt="GitHub code size in bytes"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/snyk/vulnerabilities/github/bravo68web/shx?style=for-the-badge"
|
||||
alt="Snyk Vulnerabilities for GitHub Repo"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/codefactor/grade/github/BRAVO68WEB/shx?logo=codefactor&style=for-the-badge"
|
||||
alt="CodeFactor Grade"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/languages/top/bravo68web/shx?style=for-the-badge"
|
||||
alt="GitHub top language"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://forthebadge.com"
|
||||
><img
|
||||
src="https://forthebadge.com/images/badges/made-with-typescript.svg"
|
||||
alt="forthebadge"
|
||||
/></a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://forthebadge.com"
|
||||
><img
|
||||
src="https://forthebadge.com/images/badges/powered-by-black-magic.svg"
|
||||
alt="forthebadge"
|
||||
/></a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://forthebadge.com"
|
||||
><img
|
||||
src="https://forthebadge.com/images/badges/built-with-love.svg"
|
||||
alt="forthebadge"
|
||||
/></a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://sonarcloud.io/summary/new_code?id=BRAVO68WEB_shx"
|
||||
><img
|
||||
src="https://sonarcloud.io/api/project_badges/quality_gate?project=BRAVO68WEB_shx"
|
||||
alt="Quality gate"
|
||||
/></a>
|
||||
</p>
|
||||
<h2 id="📝-description">📝 Description</h2>
|
||||
<p>
|
||||
Shx is a platform ment to store and share files, images, text and URLs
|
||||
with ease. This server is built using Node.js and Express.js and stores
|
||||
the uploaded content on Cloudflare R2 and PostgreSQL DB. It is
|
||||
compatible with ShareX and other clients that support the same protocol.
|
||||
</p>
|
||||
<h2 id="🛠️-technologies-used">🛠️ Technologies Used</h2>
|
||||
<ul>
|
||||
<li>
|
||||
<p>Node.js</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Express.js</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>TypeScript</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Redis</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Cloudflare R2</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Hasura Graphql (with PostgreSQL)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Commander.js</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Next.js</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Tailwind CSS</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Storybook</p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="🚀-features">🚀 Features</h2>
|
||||
<ul>
|
||||
<li>
|
||||
<p>File upload</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Image upload</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Text upload</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>URL shortener</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>CLI Support</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Web Dashboard</p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="🎁-project-setup">🎁 Project Setup</h2>
|
||||
<h3 id="packagesapi">@packages/api</h3>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/package-json/v/BRAVO68WEB/shx?filename=packages%2Fapi%2Fpackage.json&logo=npm&style=for-the-badge"
|
||||
alt="GitHub package.json version (subfolder of monorepo)"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
The API package contains the server-side code responsible for handling
|
||||
file, image, and text uploads, as well as URL shortening. It provides
|
||||
the core functionality of the ShareX server.
|
||||
</p>
|
||||
<h3 id="packagescli">@packages/cli</h3>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/package-json/v/BRAVO68WEB/shx?filename=packages%2Fcli%2Fpackage.json&logo=npm&style=for-the-badge"
|
||||
alt="GitHub package.json version (subfolder of monorepo)"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
The CLI package includes the command-line interface (CLI) for
|
||||
interacting with the ShareX server from the terminal. It allows users to
|
||||
perform various actions, such as uploading files, images, or text, and
|
||||
generating short URLs.
|
||||
</p>
|
||||
<h3 id="packagesdashboard">@packages/dashboard</h3>
|
||||
<p>
|
||||
<img
|
||||
src="https://img.shields.io/github/package-json/v/BRAVO68WEB/shx?filename=packages%2Fdashboard%2Fpackage.json&logo=npm&style=for-the-badge"
|
||||
alt="GitHub package.json version (subfolder of monorepo)"
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
The dashboard package contains the web dashboard for the ShareX server.
|
||||
It allows users to view their uploaded files, images, and text, as well
|
||||
as manage their account and settings via a web interface.
|
||||
</p>
|
||||
<h2 id="📝-license">📝 License</h2>
|
||||
<p>This project is licensed under the ISC License.</p>
|
||||
<p>For more information, please see the <code>LICENSE</code> file.</p>
|
||||
<h2 id="📧-contact">📧 Contact</h2>
|
||||
<p>
|
||||
If you have any questions or would like to contribute to the project,
|
||||
please
|
||||
</p>
|
||||
<p>contact <code>hi@b68.dev</code>.</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue