Commit 7473b098 authored by lutangar's avatar lutangar
Browse files

chore: wip

parent 5afee611
This diff is collapsed.
{
"name": "peertube-plugin-categories-client",
"version": "1.0.0",
"description": "",
"main": "src/index.js",
"scripts": {
"start": "tsc && node src/index.js",
"build": "NODE_ENV=production webpack",
"dev": "webpack --watch --progress",
"ts-node": "ts-node index.ts",
"test": "echo \"Error: no test specified\" && exit 1",
"eslint": "eslint index.ts",
"prettier": "prettier --write index.ts"
},
"author": "lutangar",
"license": "EUPL-1.2",
"dependencies": {
"@tsconfig/recommended": "^1.0.1",
"lit": "^2.0.0-rc.2",
"ts-loader": "^9.2.3",
"tsconfig-paths-webpack-plugin": "^3.5.1",
"typescript": "^4.3.5",
"webpack": "^5.45.0",
"webpack-cli": "^4.7.2"
}
}
import { html, css, LitElement } from 'lit';
import { customElement, property } from 'lit/decorators.js';
import './CategoryTableRow';
@customElement('simple-greeting')
export class CategoryTable extends LitElement {
static styles = css`
p {
color: red;
}
`;
@property()
categories = [];
render() {
return html`<table id="categories-table">
<thead>
<tr>
<th>key</th>
<th>label</th>
</tr>
</thead>
<tbody>
${this.categories.map(
(category) =>
html`<category-table-row category=${category}></category-table-row>`
)}
</tbody>
</table>`;
}
}
import { html, css, LitElement } from 'lit';
import { customElement, property } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js';
@customElement('simple-greeting')
export class CategoryTableRow extends LitElement {
static styles = css`
p {
color: blue;
}
`;
@property()
category = {};
render() {
return html`<tr
class="${classMap({
category: true,
category__deleted: this.category?.deleted,
category__added: !this.category?.original,
})}"
>
<td>${this.category.key}</td>
<td>
${this.category.label !== this.category.newLabel
? `<s>${this.category.label}</s> ${this.category.newLabel}`
: this.category.label}
</td>
</tr>`;
}
}
import './components/CategoryTable';
const fetchEnhancedCategories = () => {
const headers = new Headers();
headers.append('Accept', 'text/html');
......@@ -6,7 +8,7 @@ const fetchEnhancedCategories = () => {
}).then((response) => response.text());
};
const someNodeHasClassName = (nodeList, className) =>
const someNodeHasClassName = (nodeList: NodeList, className: string): boolean =>
nodeList &&
Array.from(nodeList).some((node) => {
if (node.classList.contains(className)) {
......@@ -42,35 +44,40 @@ const addUpdateSuccessListener = (successCallback = () => {}) => {
}
};
const updateCategoriesTable = (categoriesTable) => {
const updateCategoriesTable = (categoriesTable: string) => {
const categoriesTableElement = document.querySelector(
'#categoriesTable-wrapper table'
);
if (categoriesTableElement) {
if (categoriesTableElement && categoriesTableElement.parentElement) {
categoriesTableElement.parentElement.innerHTML = categoriesTable;
}
};
function register({ registerHook }) {
function register({ registerHook }: { registerHook: (arg: any) => void }) {
registerHook({
target: 'action:admin-plugin-settings.init',
handler: ({ npmName }) => {
handler: ({ npmName }: { npmName: string }) => {
if ('peertube-plugin-categories' !== npmName) {
return;
}
fetchEnhancedCategories().then(updateCategoriesTable);
document
.querySelector('#json-categories-as-text')
.addEventListener('input', ({ target }) => {
const jsonCategoriesAsTextElement = document.querySelector(
'#json-categories-as-text'
);
if (jsonCategoriesAsTextElement) {
jsonCategoriesAsTextElement.addEventListener('input', (e) => {
const element = e.target as HTMLTextAreaElement;
try {
JSON.parse(target.value);
target.classList.remove('error');
JSON.parse(element.value);
element.classList.remove('error');
} catch (e) {
target.classList.add('error');
element.classList.add('error');
}
});
}
addUpdateSuccessListener(() =>
fetchEnhancedCategories().then(updateCategoriesTable)
......
{
"extends": "@tsconfig/recommended/tsconfig.json",
"compilerOptions": {
"experimentalDecorators": true,
"baseUrl": ".",
"paths": {
"@api.video/web-rtmp-client": ["../client/src"]
}
}
}
const path = require('path');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
module.exports = {
entry: './src/index.ts',
devtool: 'inline-source-map',
module: {
rules: [
{
test: /\.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/,
},
],
},
resolve: {
extensions: ['.tsx', '.ts', '.js'],
plugins: [new TsconfigPathsPlugin()],
},
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'public'),
},
};
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment