feat: extension
This commit is contained in:
Nevo David
parent
93205fb2db
commit
f5efb85054
|
|
@ -0,0 +1,385 @@
|
|||
|
||||
# Created by https://www.toptal.com/developers/gitignore/api/webstorm+all,visualstudiocode,sublimetext,node,react,windows,macos,linux
|
||||
# Edit at https://www.toptal.com/developers/gitignore?templates=webstorm+all,visualstudiocode,sublimetext,node,react,windows,macos,linux
|
||||
|
||||
### Linux ###
|
||||
*~
|
||||
|
||||
# temporary files which can be created if a process still has a handle open of a deleted file
|
||||
.fuse_hidden*
|
||||
|
||||
# KDE directory preferences
|
||||
.directory
|
||||
|
||||
# Linux trash folder which might appear on any partition or disk
|
||||
.Trash-*
|
||||
|
||||
# .nfs files are created when an open file is removed but is still being accessed
|
||||
.nfs*
|
||||
|
||||
### macOS ###
|
||||
# General
|
||||
.DS_Store
|
||||
.AppleDouble
|
||||
.LSOverride
|
||||
|
||||
# Icon must end with two \r
|
||||
Icon
|
||||
|
||||
|
||||
# Thumbnails
|
||||
._*
|
||||
|
||||
# Files that might appear in the root of a volume
|
||||
.DocumentRevisions-V100
|
||||
.fseventsd
|
||||
.Spotlight-V100
|
||||
.TemporaryItems
|
||||
.Trashes
|
||||
.VolumeIcon.icns
|
||||
.com.apple.timemachine.donotpresent
|
||||
|
||||
# Directories potentially created on remote AFP share
|
||||
.AppleDB
|
||||
.AppleDesktop
|
||||
Network Trash Folder
|
||||
Temporary Items
|
||||
.apdisk
|
||||
|
||||
### macOS Patch ###
|
||||
# iCloud generated files
|
||||
*.icloud
|
||||
|
||||
### Node ###
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
lerna-debug.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
*.lcov
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Snowpack dependency directory (https://snowpack.dev/)
|
||||
web_modules/
|
||||
|
||||
# TypeScript cache
|
||||
*.tsbuildinfo
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional stylelint cache
|
||||
.stylelintcache
|
||||
|
||||
# Microbundle cache
|
||||
.rpt2_cache/
|
||||
.rts2_cache_cjs/
|
||||
.rts2_cache_es/
|
||||
.rts2_cache_umd/
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
||||
# dotenv environment variable files
|
||||
.env
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.env.local
|
||||
|
||||
# parcel-bundler cache (https://parceljs.org/)
|
||||
.cache
|
||||
.parcel-cache
|
||||
|
||||
# Next.js build output
|
||||
.next
|
||||
out
|
||||
|
||||
# Nuxt.js build / generate output
|
||||
.nuxt
|
||||
dist
|
||||
|
||||
# Gatsby files
|
||||
.cache/
|
||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||
# public
|
||||
|
||||
# vuepress build output
|
||||
.vuepress/dist
|
||||
|
||||
# vuepress v2.x temp and cache directory
|
||||
.temp
|
||||
|
||||
# Docusaurus cache and generated files
|
||||
.docusaurus
|
||||
|
||||
# Serverless directories
|
||||
.serverless/
|
||||
|
||||
# FuseBox cache
|
||||
.fusebox/
|
||||
|
||||
# DynamoDB Local files
|
||||
.dynamodb/
|
||||
|
||||
# TernJS port file
|
||||
.tern-port
|
||||
|
||||
# Stores VSCode versions used for testing VSCode extensions
|
||||
.vscode-test
|
||||
|
||||
# yarn v2
|
||||
.yarn/cache
|
||||
.yarn/unplugged
|
||||
.yarn/build-state.yml
|
||||
.yarn/install-state.gz
|
||||
.pnp.*
|
||||
|
||||
### Node Patch ###
|
||||
# Serverless Webpack directories
|
||||
.webpack/
|
||||
|
||||
# Optional stylelint cache
|
||||
|
||||
# SvelteKit build / generate output
|
||||
.svelte-kit
|
||||
|
||||
### react ###
|
||||
.DS_*
|
||||
**/*.backup.*
|
||||
**/*.back.*
|
||||
|
||||
node_modules
|
||||
|
||||
*.sublime*
|
||||
|
||||
psd
|
||||
thumb
|
||||
sketch
|
||||
|
||||
### SublimeText ###
|
||||
# Cache files for Sublime Text
|
||||
*.tmlanguage.cache
|
||||
*.tmPreferences.cache
|
||||
*.stTheme.cache
|
||||
|
||||
# Workspace files are user-specific
|
||||
*.sublime-workspace
|
||||
|
||||
# Project files should be checked into the repository, unless a significant
|
||||
# proportion of contributors will probably not be using Sublime Text
|
||||
# *.sublime-project
|
||||
|
||||
# SFTP configuration file
|
||||
sftp-config.json
|
||||
sftp-config-alt*.json
|
||||
|
||||
# Package control specific files
|
||||
Package Control.last-run
|
||||
Package Control.ca-list
|
||||
Package Control.ca-bundle
|
||||
Package Control.system-ca-bundle
|
||||
Package Control.cache/
|
||||
Package Control.ca-certs/
|
||||
Package Control.merged-ca-bundle
|
||||
Package Control.user-ca-bundle
|
||||
oscrypto-ca-bundle.crt
|
||||
bh_unicode_properties.cache
|
||||
|
||||
# Sublime-github package stores a github token in this file
|
||||
# https://packagecontrol.io/packages/sublime-github
|
||||
GitHub.sublime-settings
|
||||
|
||||
### VisualStudioCode ###
|
||||
.vscode/*
|
||||
!.vscode/settings.json
|
||||
!.vscode/tasks.json
|
||||
!.vscode/launch.json
|
||||
!.vscode/extensions.json
|
||||
!.vscode/*.code-snippets
|
||||
|
||||
# Local History for Visual Studio Code
|
||||
.history/
|
||||
|
||||
# Built Visual Studio Code Extensions
|
||||
*.vsix
|
||||
|
||||
### VisualStudioCode Patch ###
|
||||
# Ignore all local history of files
|
||||
.history
|
||||
.ionide
|
||||
|
||||
# Support for Project snippet scope
|
||||
|
||||
### WebStorm+all ###
|
||||
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio, WebStorm and Rider
|
||||
# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
|
||||
|
||||
# User-specific stuff
|
||||
.idea/**/workspace.xml
|
||||
.idea/**/tasks.xml
|
||||
.idea/**/usage.statistics.xml
|
||||
.idea/**/dictionaries
|
||||
.idea/**/shelf
|
||||
|
||||
# AWS User-specific
|
||||
.idea/**/aws.xml
|
||||
|
||||
# Generated files
|
||||
.idea/**/contentModel.xml
|
||||
|
||||
# Sensitive or high-churn files
|
||||
.idea/**/dataSources/
|
||||
.idea/**/dataSources.ids
|
||||
.idea/**/dataSources.local.xml
|
||||
.idea/**/sqlDataSources.xml
|
||||
.idea/**/dynamic.xml
|
||||
.idea/**/uiDesigner.xml
|
||||
.idea/**/dbnavigator.xml
|
||||
|
||||
# Gradle
|
||||
.idea/**/gradle.xml
|
||||
.idea/**/libraries
|
||||
|
||||
# Gradle and Maven with auto-import
|
||||
# When using Gradle or Maven with auto-import, you should exclude module files,
|
||||
# since they will be recreated, and may cause churn. Uncomment if using
|
||||
# auto-import.
|
||||
# .idea/artifacts
|
||||
# .idea/compiler.xml
|
||||
# .idea/jarRepositories.xml
|
||||
# .idea/modules.xml
|
||||
# .idea/*.iml
|
||||
# .idea/modules
|
||||
# *.iml
|
||||
# *.ipr
|
||||
|
||||
# CMake
|
||||
cmake-build-*/
|
||||
|
||||
# Mongo Explorer plugin
|
||||
.idea/**/mongoSettings.xml
|
||||
|
||||
# File-based project format
|
||||
*.iws
|
||||
|
||||
# IntelliJ
|
||||
out/
|
||||
|
||||
# mpeltonen/sbt-idea plugin
|
||||
.idea_modules/
|
||||
|
||||
# JIRA plugin
|
||||
atlassian-ide-plugin.xml
|
||||
|
||||
# Cursive Clojure plugin
|
||||
.idea/replstate.xml
|
||||
|
||||
# SonarLint plugin
|
||||
.idea/sonarlint/
|
||||
|
||||
# Crashlytics plugin (for Android Studio and IntelliJ)
|
||||
com_crashlytics_export_strings.xml
|
||||
crashlytics.properties
|
||||
crashlytics-build.properties
|
||||
fabric.properties
|
||||
|
||||
# Editor-based Rest Client
|
||||
.idea/httpRequests
|
||||
|
||||
# Android studio 3.1+ serialized cache file
|
||||
.idea/caches/build_file_checksums.ser
|
||||
|
||||
### WebStorm+all Patch ###
|
||||
# Ignore everything but code style settings and run configurations
|
||||
# that are supposed to be shared within teams.
|
||||
|
||||
.idea/*
|
||||
|
||||
!.idea/codeStyles
|
||||
!.idea/runConfigurations
|
||||
|
||||
### Windows ###
|
||||
# Windows thumbnail cache files
|
||||
Thumbs.db
|
||||
Thumbs.db:encryptable
|
||||
ehthumbs.db
|
||||
ehthumbs_vista.db
|
||||
|
||||
# Dump file
|
||||
*.stackdump
|
||||
|
||||
# Folder config file
|
||||
[Dd]esktop.ini
|
||||
|
||||
# Recycle Bin used on file shares
|
||||
$RECYCLE.BIN/
|
||||
|
||||
# Windows Installer files
|
||||
*.cab
|
||||
*.msi
|
||||
*.msix
|
||||
*.msm
|
||||
*.msp
|
||||
|
||||
# Windows shortcuts
|
||||
*.lnk
|
||||
|
||||
# End of https://www.toptal.com/developers/gitignore/api/webstorm+all,visualstudiocode,sublimetext,node,react,windows,macos,linux
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# etc
|
||||
.idea
|
||||
|
||||
#generated manifest
|
||||
public/manifest.json
|
||||
|
||||
extension.zip
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
import fs from 'fs';
|
||||
import { resolve } from 'path';
|
||||
import type { PluginOption } from 'vite';
|
||||
|
||||
// plugin to remove dev icons from prod build
|
||||
export function stripDevIcons (isDev: boolean) {
|
||||
if (isDev) return null
|
||||
|
||||
return {
|
||||
name: 'strip-dev-icons',
|
||||
resolveId (source: string) {
|
||||
return source === 'virtual-module' ? source : null
|
||||
},
|
||||
renderStart (outputOptions: any, inputOptions: any) {
|
||||
const outDir = outputOptions.dir
|
||||
fs.rm(resolve(outDir, 'dev-icon-32.png'), () => console.log(`Deleted dev-icon-32.png from prod build`))
|
||||
fs.rm(resolve(outDir, 'dev-icon-128.png'), () => console.log(`Deleted dev-icon-128.png from prod build`))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// plugin to support i18n
|
||||
export function crxI18n (options: { localize: boolean, src: string }): PluginOption {
|
||||
if (!options.localize) return null
|
||||
|
||||
const getJsonFiles = (dir: string): Array<string> => {
|
||||
const files = fs.readdirSync(dir, {recursive: true}) as string[]
|
||||
return files.filter(file => !!file && file.endsWith('.json'))
|
||||
}
|
||||
const entry = resolve(__dirname, options.src)
|
||||
const localeFiles = getJsonFiles(entry)
|
||||
const files = localeFiles.map(file => {
|
||||
return {
|
||||
id: '',
|
||||
fileName: file,
|
||||
source: fs.readFileSync(resolve(entry, file))
|
||||
}
|
||||
})
|
||||
return {
|
||||
name: 'crx-i18n',
|
||||
enforce: 'pre',
|
||||
buildStart: {
|
||||
order: 'post',
|
||||
handler() {
|
||||
files.forEach((file) => {
|
||||
const refId = this.emitFile({
|
||||
type: 'asset',
|
||||
source: file.source,
|
||||
fileName: '_locales/'+file.fileName
|
||||
})
|
||||
file.id = refId
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
{
|
||||
"action": {
|
||||
"default_icon": "public/dev-icon-32.png",
|
||||
"default_popup": "src/pages/popup/index.html"
|
||||
},
|
||||
"icons": {
|
||||
"128": "public/dev-icon-128.png"
|
||||
},
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": [
|
||||
"contentStyle.css",
|
||||
"dev-icon-128.png",
|
||||
"dev-icon-32.png"
|
||||
],
|
||||
"matches": []
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
{
|
||||
"manifest_version": 3,
|
||||
"name": "Postiz",
|
||||
"description": "Grow faster on socials",
|
||||
"options_ui": {
|
||||
"page": "src/pages/options/index.html"
|
||||
},
|
||||
"action": {
|
||||
"default_popup": "src/pages/popup/index.html",
|
||||
"default_icon": {
|
||||
"32": "icon-32.png"
|
||||
}
|
||||
},
|
||||
"icons": {
|
||||
"128": "icon-128.png"
|
||||
},
|
||||
"permissions": ["activeTab", "cookies", "tabs", "storage"],
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": ["http://*/*", "https://*/*", "<all_urls>"],
|
||||
"js": ["src/pages/content/index.tsx"],
|
||||
"css": ["contentStyle.css"]
|
||||
}
|
||||
],
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": ["contentStyle.css", "icon-128.png", "icon-32.png"],
|
||||
"matches": []
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
{
|
||||
"env": {
|
||||
"__DEV__": "true"
|
||||
},
|
||||
"watch": [
|
||||
"src",
|
||||
"utils",
|
||||
"vite.config.base.ts",
|
||||
"vite.config.chrome.ts",
|
||||
"manifest.json",
|
||||
"manifest.dev.json"
|
||||
],
|
||||
"ext": "tsx,css,html,ts,json",
|
||||
"ignore": [
|
||||
"src/**/*.spec.ts"
|
||||
],
|
||||
"exec": "vite build --config vite.config.chrome.ts --mode development"
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
{
|
||||
"env": {
|
||||
"__DEV__": "true"
|
||||
},
|
||||
"watch": [
|
||||
"src",
|
||||
"utils",
|
||||
"vite.config.base.ts",
|
||||
"vite.config.firefox.ts",
|
||||
"manifest.json",
|
||||
"manifest.dev.json"
|
||||
],
|
||||
"ext": "tsx,css,html,ts,json",
|
||||
"ignore": [
|
||||
"src/**/*.spec.ts"
|
||||
],
|
||||
"exec": "vite build --config vite.config.firefox.ts --mode development"
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
{
|
||||
"name": "postiz-extension",
|
||||
"version": "1.0.0",
|
||||
"description": "A simple chrome & firefox extension template with Vite, React, TypeScript and Tailwind CSS.",
|
||||
"scripts": {
|
||||
"build": "rm -rf dist && vite build --config vite.config.chrome.ts && zip -r extension.zip dist",
|
||||
"build:chrome": "vite build --config vite.config.chrome.ts",
|
||||
"build:firefox": "vite build --config vite.config.firefox.ts",
|
||||
"dev": "rm -rf dist && NODE_ENV=development dotenv -e ../../.env -- vite build --config vite.config.chrome.ts --mode development --watch",
|
||||
"dev:chrome": "nodemon --config nodemon.chrome.json",
|
||||
"dev:firefox": "nodemon --config nodemon.firefox.json"
|
||||
},
|
||||
"type": "module"
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
|
|
@ -0,0 +1,7 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
|
||||
<g fill="#61DAFB">
|
||||
<path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
|
||||
<circle cx="420.9" cy="296.5" r="45.7"/>
|
||||
<path d="M520.5 78.1z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
|
|
@ -0,0 +1,13 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@theme {
|
||||
--animate-spin-slow: spin 20s linear infinite;
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
declare module '*.svg' {
|
||||
import React = require('react');
|
||||
export const ReactComponent: React.SFC<React.SVGProps<SVGSVGElement>>;
|
||||
const src: string;
|
||||
export default src;
|
||||
}
|
||||
|
||||
declare module '*.json' {
|
||||
const content: string;
|
||||
export default content;
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
{
|
||||
"extName": {
|
||||
"message": "name in src/locales/en/messages.json",
|
||||
"description": "Extension name"
|
||||
},
|
||||
"extDescription": {
|
||||
"message": "description in src/locales/en/messages.json",
|
||||
"description": "Extension description"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
import { fetchRequestUtil } from "@gitroom/extension/utils/request.util";
|
||||
|
||||
const isDevelopment = process.env.NODE_ENV === "development";
|
||||
|
||||
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
|
||||
if (request.action === "makeHttpRequest") {
|
||||
fetchRequestUtil(request).then((response) => {
|
||||
sendResponse(response);
|
||||
});
|
||||
}
|
||||
|
||||
if (request.action === "loadStorage") {
|
||||
chrome.storage.local.get([request.key],
|
||||
function (storage) {
|
||||
sendResponse(storage[request.key]);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
if (request.action === "saveStorage") {
|
||||
chrome.storage.local.set(
|
||||
{ [request.key]: request.value },
|
||||
function () {
|
||||
sendResponse({ success: true });
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
if (request.action === "loadCookie") {
|
||||
chrome.cookies.get(
|
||||
{
|
||||
url: isDevelopment
|
||||
? "http://localhost:4200"
|
||||
: "https://platform.postiz.com",
|
||||
name: request.cookieName,
|
||||
},
|
||||
function (cookies) {
|
||||
sendResponse(cookies?.value);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
return true;
|
||||
});
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
import { FC, memo, useCallback, useEffect, useState } from 'react';
|
||||
import { ProviderInterface } from '@gitroom/extension/providers/provider.interface';
|
||||
|
||||
const Comp: FC<{ removeModal: () => void; style: string }> = (props) => {
|
||||
useEffect(() => {
|
||||
if (document.querySelector('iframe#modal-postiz')) {
|
||||
return;
|
||||
}
|
||||
|
||||
const div = document.createElement('div');
|
||||
div.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';
|
||||
div.style.position = 'fixed';
|
||||
div.style.top = '0';
|
||||
div.style.left = '0';
|
||||
div.style.zIndex = '9999';
|
||||
div.style.width = '100%';
|
||||
div.style.height = '100%';
|
||||
div.style.border = 'none';
|
||||
div.style.overflow = 'hidden';
|
||||
document.body.appendChild(div);
|
||||
|
||||
const iframe = document.createElement('iframe');
|
||||
iframe.style.backgroundColor = 'transparent';
|
||||
// @ts-ignore
|
||||
iframe.allowTransparency = 'true';
|
||||
iframe.src = import.meta.env.FRONTEND_URL + `/modal/${props.style}`;
|
||||
iframe.id = 'modal-postiz';
|
||||
iframe.style.width = '100%';
|
||||
iframe.style.height = '100%';
|
||||
iframe.style.position = 'fixed';
|
||||
iframe.style.top = '0';
|
||||
iframe.style.left = '0';
|
||||
iframe.style.zIndex = '9999';
|
||||
iframe.style.border = 'none';
|
||||
div.appendChild(iframe);
|
||||
|
||||
window.addEventListener('message', (event) => {
|
||||
if (event.data.action === 'closeIframe') {
|
||||
const iframe = document.querySelector('iframe#modal-postiz');
|
||||
if (iframe) {
|
||||
props.removeModal();
|
||||
div.remove();
|
||||
}
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
return <></>;
|
||||
};
|
||||
export const ActionComponent: FC<{
|
||||
target: Node;
|
||||
keyIndex: number;
|
||||
actionType: string;
|
||||
provider: ProviderInterface;
|
||||
wrap: boolean;
|
||||
}> = memo((props) => {
|
||||
const { wrap, provider, target, actionType } = props;
|
||||
const [modal, showModal] = useState(false);
|
||||
const handle = useCallback(async (e: any) => {
|
||||
showModal(true);
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (document.querySelector('#blockingDiv')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// @ts-ignore
|
||||
const targetInformation = target.getBoundingClientRect();
|
||||
const blockingDiv = document.createElement('div');
|
||||
blockingDiv.style.position = 'absolute';
|
||||
blockingDiv.id = 'blockingDiv';
|
||||
blockingDiv.style.cursor = 'pointer';
|
||||
blockingDiv.style.top = `${targetInformation.top}px`;
|
||||
blockingDiv.style.left = `${targetInformation.left}px`;
|
||||
blockingDiv.style.width = `${targetInformation.width}px`;
|
||||
blockingDiv.style.height = `${targetInformation.height}px`;
|
||||
blockingDiv.style.zIndex = '9999';
|
||||
|
||||
document.body.appendChild(blockingDiv);
|
||||
blockingDiv.addEventListener('click', handle);
|
||||
return () => {
|
||||
blockingDiv.removeEventListener('click', handle);
|
||||
blockingDiv.remove();
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="g-wrapper" style={{ position: 'relative' }}>
|
||||
<div className="absolute left-0 top-0 z-[9999] w-full h-full" />
|
||||
{modal && (
|
||||
<Comp style={provider.style} removeModal={() => showModal(false)} />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
import { createRoot } from "react-dom/client";
|
||||
import "./style.css";
|
||||
import { MainContent } from "@gitroom/extension/pages/content/main.content";
|
||||
const div = document.createElement("div");
|
||||
div.id = "__root";
|
||||
document.body.appendChild(div);
|
||||
|
||||
const rootContainer = document.querySelector("#__root");
|
||||
if (!rootContainer) throw new Error("Can't find Content root element");
|
||||
const root = createRoot(rootContainer);
|
||||
root.render(<MainContent />);
|
||||
|
|
@ -0,0 +1,165 @@
|
|||
import {
|
||||
FC,
|
||||
Fragment,
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from 'react';
|
||||
import { ProviderList } from '@gitroom/extension/providers/provider.list';
|
||||
import { createPortal } from 'react-dom';
|
||||
import { ActionComponent } from '@gitroom/extension/pages/content/elements/action.component';
|
||||
|
||||
// Define a type to track elements with their action types
|
||||
interface ActionElement {
|
||||
element: HTMLElement;
|
||||
actionType: string;
|
||||
}
|
||||
|
||||
export const MainContent: FC = () => {
|
||||
return <MainContentInner />;
|
||||
};
|
||||
|
||||
export const MainContentInner: FC = (props) => {
|
||||
const [actionElements, setActionElements] = useState<ActionElement[]>([]);
|
||||
const actionSetRef = useRef(new Map<HTMLElement, string>());
|
||||
const provider = useMemo(() => {
|
||||
return ProviderList.find((p) => {
|
||||
return p.baseUrl.indexOf(new URL(window.location.href).hostname) > -1;
|
||||
});
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!provider) return;
|
||||
|
||||
// Helper to scan DOM for existing matching elements
|
||||
const scanDOMForExistingMatches = () => {
|
||||
const action = { selector: provider.element, type: 'post' };
|
||||
const matches = document.querySelectorAll(action.selector);
|
||||
matches.forEach((match) => {
|
||||
const htmlMatch = match as HTMLElement;
|
||||
if (!actionSetRef.current.has(htmlMatch)) {
|
||||
actionSetRef.current.set(htmlMatch, action.type);
|
||||
}
|
||||
});
|
||||
|
||||
// Update state
|
||||
const elements: ActionElement[] = [];
|
||||
actionSetRef.current.forEach((actionType, element) => {
|
||||
elements.push({ element, actionType });
|
||||
});
|
||||
setActionElements(elements);
|
||||
};
|
||||
|
||||
// Initial scan before observing
|
||||
scanDOMForExistingMatches();
|
||||
|
||||
const observer = new MutationObserver((mutationsList) => {
|
||||
let addedSomething = false;
|
||||
let removedSomething = false;
|
||||
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'childList') {
|
||||
for (const node of mutation.addedNodes) {
|
||||
if (node.nodeType === Node.ELEMENT_NODE) {
|
||||
const el = node as HTMLElement;
|
||||
|
||||
const action = { selector: provider.element, type: 'post' };
|
||||
if (
|
||||
el.matches?.(action.selector) &&
|
||||
!actionSetRef.current.has(el)
|
||||
) {
|
||||
actionSetRef.current.set(el, action.type);
|
||||
addedSomething = true;
|
||||
}
|
||||
|
||||
if (el.querySelectorAll) {
|
||||
const matches = el.querySelectorAll(action.selector);
|
||||
matches.forEach((match) => {
|
||||
const htmlMatch = match as HTMLElement;
|
||||
if (!actionSetRef.current.has(htmlMatch)) {
|
||||
actionSetRef.current.set(htmlMatch, action.type);
|
||||
addedSomething = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (const node of mutation.removedNodes) {
|
||||
if (node.nodeType === Node.ELEMENT_NODE) {
|
||||
const el = node as HTMLElement;
|
||||
|
||||
if (actionSetRef.current.has(el)) {
|
||||
actionSetRef.current.delete(el);
|
||||
removedSomething = true;
|
||||
}
|
||||
|
||||
const action = { selector: provider.element, type: 'post' };
|
||||
if (el.querySelectorAll) {
|
||||
const matches = el.querySelectorAll(action.selector);
|
||||
matches.forEach((match) => {
|
||||
const htmlMatch = match as HTMLElement;
|
||||
if (actionSetRef.current.has(htmlMatch)) {
|
||||
actionSetRef.current.delete(htmlMatch);
|
||||
removedSomething = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (mutation.type === 'attributes') {
|
||||
const el = mutation.target;
|
||||
if (el instanceof HTMLElement) {
|
||||
const action = { selector: provider.element, type: 'post' };
|
||||
const matchesNow = el.matches(action.selector);
|
||||
const wasTracked = actionSetRef.current.has(el);
|
||||
|
||||
if (matchesNow && !wasTracked) {
|
||||
actionSetRef.current.set(el, action.type);
|
||||
addedSomething = true;
|
||||
} else if (!matchesNow && wasTracked) {
|
||||
actionSetRef.current.delete(el);
|
||||
removedSomething = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (addedSomething || removedSomething) {
|
||||
const elements: ActionElement[] = [];
|
||||
actionSetRef.current.forEach((actionType, element) => {
|
||||
elements.push({ element, actionType });
|
||||
});
|
||||
setActionElements(elements);
|
||||
}
|
||||
});
|
||||
|
||||
observer.observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true,
|
||||
attributes: true,
|
||||
attributeOldValue: true,
|
||||
});
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, []);
|
||||
|
||||
return actionElements.map((actionEl, index) => (
|
||||
<Fragment key={index}>
|
||||
{createPortal(
|
||||
<ActionComponent
|
||||
target={actionEl.element}
|
||||
keyIndex={index}
|
||||
actionType={actionEl.actionType}
|
||||
provider={provider}
|
||||
wrap={true}
|
||||
/>,
|
||||
actionEl.element
|
||||
)}
|
||||
</Fragment>
|
||||
));
|
||||
};
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
.my-wrapper {
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
position: fixed !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
z-index: 999999 !important;
|
||||
display: flex !important;
|
||||
justify-content: center !important;
|
||||
background: rgba(0, 0, 0, 0.5) !important;
|
||||
}
|
||||
|
||||
.my-wrapper > div {
|
||||
background: white !important;
|
||||
width: 600px !important;
|
||||
height: 300px !important;
|
||||
border-radius: 10px !important;
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
justify-items: center !important;
|
||||
margin-top: 100px !important;
|
||||
color: black !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.container {
|
||||
width: 100%;
|
||||
height: 50vh;
|
||||
font-size: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
import React from 'react';
|
||||
import '@gitroom/extension/pages/options/Options.css';
|
||||
|
||||
export default function Options() {
|
||||
return <div className="container">Options</div>;
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Options</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="__root"></div>
|
||||
<script type="module" src="./index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
import React from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import '@gitroom/extension/pages/options/index.css';
|
||||
import Options from "@gitroom/extension/pages/options/Options";
|
||||
|
||||
function init() {
|
||||
const rootContainer = document.querySelector("#__root");
|
||||
if (!rootContainer) throw new Error("Can't find Options root element");
|
||||
const root = createRoot(rootContainer);
|
||||
root.render(<Options />);
|
||||
}
|
||||
|
||||
init();
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
body {
|
||||
background-color: #242424;
|
||||
}
|
||||
|
||||
.container {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import React from 'react';
|
||||
import '@pages/panel/Panel.css';
|
||||
|
||||
export default function Panel() {
|
||||
return (
|
||||
<div className="container">
|
||||
<h1>Side Panel</h1>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Devtools Panel</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="__root"></div>
|
||||
<script type="module" src="./index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import React from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import Panel from '@pages/panel/Panel';
|
||||
import '@pages/panel/index.css';
|
||||
import '@assets/styles/tailwind.css';
|
||||
|
||||
function init() {
|
||||
const rootContainer = document.querySelector("#__root");
|
||||
if (!rootContainer) throw new Error("Can't find Panel root element");
|
||||
const root = createRoot(rootContainer);
|
||||
root.render(<Panel />);
|
||||
}
|
||||
|
||||
init();
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
import React, { FC, useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { ProviderList } from "@gitroom/extension/providers/provider.list";
|
||||
import { fetchCookie } from "@gitroom/extension/utils/load.cookie";
|
||||
|
||||
export const PopupContainerContainer: FC = () => {
|
||||
const [url, setUrl] = useState<string | null>(null);
|
||||
useEffect(() => {
|
||||
chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
|
||||
setUrl(tabs[0]?.url);
|
||||
});
|
||||
}, []);
|
||||
|
||||
if (!url) {
|
||||
return <div className="text-4xl">This website is not supported by Postiz</div>;
|
||||
}
|
||||
|
||||
return <PopupContainer url={url} />;
|
||||
};
|
||||
|
||||
export const PopupContainer: FC<{ url: string }> = (props) => {
|
||||
const { url } = props;
|
||||
const [isLoggedIn, setIsLoggedIn] = useState<false | string>(false);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const provider = useMemo(() => {
|
||||
return ProviderList.find((p) => {
|
||||
return p.baseUrl.indexOf(new URL(url).hostname) > -1;
|
||||
});
|
||||
}, [url]);
|
||||
|
||||
const loadCookie = useCallback(async () => {
|
||||
try {
|
||||
if (!provider) {
|
||||
setIsLoading(false);
|
||||
return;
|
||||
}
|
||||
const auth = await fetchCookie(`auth`);
|
||||
|
||||
if (auth) {
|
||||
setIsLoggedIn(auth);
|
||||
}
|
||||
|
||||
setIsLoading(false);
|
||||
} catch (e) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
loadCookie();
|
||||
}, []);
|
||||
|
||||
if (isLoading) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (!provider) {
|
||||
return <div className="text-4xl">This website is not supported by Postiz</div>;
|
||||
}
|
||||
|
||||
if (!isLoggedIn) {
|
||||
return <div className="text-4xl">You are not logged in to Postiz</div>;
|
||||
}
|
||||
|
||||
return <div />;
|
||||
};
|
||||
|
||||
export default function Popup() {
|
||||
return (
|
||||
<div className="flex justify-center items-center h-screen">
|
||||
<PopupContainerContainer />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
body {
|
||||
width: 300px;
|
||||
height: 260px;
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||
sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Popup</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="__root"></div>
|
||||
<script type="module" src="./index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import React from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import './index.css';
|
||||
import '@gitroom/extension/assets/styles/tailwind.css';
|
||||
import Popup from "@gitroom/extension/pages/popup/Popup";
|
||||
|
||||
function init() {
|
||||
const rootContainer = document.querySelector("#__root");
|
||||
if (!rootContainer) throw new Error("Can't find Popup root element");
|
||||
const root = createRoot(rootContainer);
|
||||
root.render(<Popup />);
|
||||
}
|
||||
|
||||
init();
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { ProviderInterface } from "@gitroom/extension/providers/provider.interface";
|
||||
|
||||
export class LinkedinProvider implements ProviderInterface {
|
||||
identifier = "linkedin";
|
||||
baseUrl = "https://www.linkedin.com";
|
||||
element = `.share-box-feed-entry__closed-share-box`;
|
||||
attachTo = `[role="main"]`;
|
||||
style = "light" as "light";
|
||||
findIdentifier = (element: HTMLElement) => {
|
||||
return element.closest('[data-urn]').getAttribute("data-urn");
|
||||
};
|
||||
}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
import { ProviderInterface } from '@gitroom/extension/providers/provider.interface';
|
||||
|
||||
export class XProvider implements ProviderInterface {
|
||||
identifier = 'x';
|
||||
baseUrl = 'https://x.com';
|
||||
element = `[data-testid="tweetTextarea_0_label"]`;
|
||||
attachTo = `#react-root`;
|
||||
style = "dark" as "dark";
|
||||
findIdentifier = (element: HTMLElement) => {
|
||||
return (
|
||||
Array.from(
|
||||
(
|
||||
element?.closest('article') ||
|
||||
element?.closest(`[aria-labelledby="modal-header"]`)
|
||||
)?.querySelectorAll('a') || []
|
||||
)
|
||||
?.find((p) => {
|
||||
return p?.getAttribute('href')?.includes('/status/');
|
||||
})
|
||||
?.getAttribute('href')
|
||||
?.split('/status/')?.[1] || window.location.href.split('/status/')?.[1]
|
||||
);
|
||||
};
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
export interface ProviderInterface {
|
||||
identifier: string;
|
||||
baseUrl: string;
|
||||
element: string;
|
||||
findIdentifier: (element: HTMLElement) => string;
|
||||
attachTo: string;
|
||||
style: 'dark' | 'light';
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import { XProvider } from './list/x.provider';
|
||||
import { ProviderInterface } from './provider.interface';
|
||||
import { LinkedinProvider } from './list/linkedin.provider';
|
||||
|
||||
export const ProviderList = [
|
||||
new XProvider(),
|
||||
new LinkedinProvider(),
|
||||
] satisfies ProviderInterface[] as ProviderInterface[];
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
export const fetchCookie = (cookieName: string) => {
|
||||
return chrome.runtime.sendMessage({
|
||||
action: "loadCookie",
|
||||
cookieName,
|
||||
});
|
||||
};
|
||||
|
||||
export const getCookie = async (
|
||||
cookies: chrome.cookies.Cookie[],
|
||||
cookie: string,
|
||||
) => {
|
||||
// return cookies.find((c) => c.name === cookie).value;
|
||||
};
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
export const fetchStorage = (key: string) => {
|
||||
return chrome.runtime.sendMessage({
|
||||
action: "loadStorage",
|
||||
key,
|
||||
});
|
||||
};
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
const isDev = process.env.NODE_ENV === "development";
|
||||
export const sendRequest = (
|
||||
auth: string,
|
||||
url: string,
|
||||
method: "GET" | "POST",
|
||||
body?: string,
|
||||
) => {
|
||||
return chrome.runtime.sendMessage({
|
||||
action: "makeHttpRequest",
|
||||
url,
|
||||
method,
|
||||
body,
|
||||
auth,
|
||||
});
|
||||
};
|
||||
|
||||
export const fetchRequestUtil = async (request: any) => {
|
||||
return (
|
||||
await fetch(
|
||||
(isDev
|
||||
? "http://localhost:4200/v1/api"
|
||||
: "https://platform.postiz.com/v1/api") + request.url,
|
||||
{
|
||||
method: request.method || "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
Authorization: request.auth,
|
||||
// Add any auth headers here if needed
|
||||
},
|
||||
...(request.body ? { body: request.body } : {}),
|
||||
},
|
||||
)
|
||||
).json();
|
||||
};
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
export const saveStorage = (key: string, value: any) => {
|
||||
return chrome.runtime.sendMessage({
|
||||
action: "saveStorage",
|
||||
key,
|
||||
value,
|
||||
});
|
||||
};
|
||||
|
|
@ -0,0 +1 @@
|
|||
/// <reference types="vite/client" />
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
{
|
||||
"extends": "../../tsconfig.base.json",
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
"types": ["vite/client", "node", "chrome"],
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": false,
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": true,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
},
|
||||
"include": [
|
||||
"src",
|
||||
"utils",
|
||||
"vite.config.base.ts",
|
||||
"vite.config.chrome.ts",
|
||||
"vite.config.firefox.ts"
|
||||
],
|
||||
}
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
import react from "@vitejs/plugin-react";
|
||||
import { resolve } from "path";
|
||||
import { ManifestV3Export } from "@crxjs/vite-plugin";
|
||||
import tailwindcss from "@tailwindcss/vite";
|
||||
import { defineConfig, BuildOptions } from "vite";
|
||||
import tsconfigPaths from "vite-tsconfig-paths";
|
||||
import { stripDevIcons, crxI18n } from "./custom-vite-plugins";
|
||||
import manifest from "./manifest.json";
|
||||
import devManifest from "./manifest.dev.json";
|
||||
import pkg from "./package.json";
|
||||
import { ProviderList } from "./src/providers/provider.list";
|
||||
|
||||
const isDev = process.env.NODE_ENV === "development";
|
||||
// set this flag to true, if you want localization support
|
||||
const localize = false;
|
||||
|
||||
const merge = isDev ? devManifest : ({} as ManifestV3Export);
|
||||
const { matches, ...rest } = manifest?.content_scripts?.[0] || {};
|
||||
|
||||
export const baseManifest = {
|
||||
...manifest,
|
||||
host_permissions: [
|
||||
...ProviderList.map((p) => p.baseUrl + "/"),
|
||||
isDev ? "http://localhost:4200/" : "https://platform.postiz.com/",
|
||||
],
|
||||
permissions: [...(manifest.permissions || [])],
|
||||
content_scripts: [
|
||||
{
|
||||
matches: ProviderList.reduce(
|
||||
(all, p) => [...all, p.baseUrl + "/*"],
|
||||
[
|
||||
isDev
|
||||
? "http://localhost:4200/*"
|
||||
: "https://platform.postiz.com/*",
|
||||
],
|
||||
),
|
||||
...rest,
|
||||
},
|
||||
],
|
||||
version: pkg.version,
|
||||
...merge,
|
||||
...(localize
|
||||
? {
|
||||
name: "__MSG_extName__",
|
||||
description: "__MSG_extDescription__",
|
||||
default_locale: "en",
|
||||
}
|
||||
: {}),
|
||||
} as ManifestV3Export;
|
||||
|
||||
export const baseBuildOptions: BuildOptions = {
|
||||
sourcemap: isDev,
|
||||
emptyOutDir: !isDev,
|
||||
};
|
||||
|
||||
export default defineConfig({
|
||||
envPrefix: ["NEXT_PUBLIC_", "FRONTEND_URL"],
|
||||
plugins: [
|
||||
tailwindcss(),
|
||||
tsconfigPaths(),
|
||||
react(),
|
||||
stripDevIcons(isDev),
|
||||
crxI18n({ localize, src: "./src/locales" }),
|
||||
],
|
||||
publicDir: resolve(__dirname, "public"),
|
||||
});
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
import { resolve } from "path";
|
||||
import { mergeConfig, defineConfig } from "vite";
|
||||
import { crx, ManifestV3Export } from "@crxjs/vite-plugin";
|
||||
import baseConfig, { baseManifest, baseBuildOptions } from "./vite.config.base";
|
||||
import hotReloadExtension from "hot-reload-extension-vite";
|
||||
|
||||
const outDir = resolve(__dirname, "dist");
|
||||
const isDev = process.env.NODE_ENV === "development";
|
||||
|
||||
export default mergeConfig(
|
||||
baseConfig,
|
||||
defineConfig({
|
||||
plugins: [
|
||||
crx({
|
||||
manifest: {
|
||||
...baseManifest,
|
||||
background: {
|
||||
service_worker: "src/pages/background/index.ts",
|
||||
type: "module",
|
||||
},
|
||||
} as ManifestV3Export,
|
||||
browser: "chrome",
|
||||
contentScripts: {
|
||||
injectCss: true,
|
||||
},
|
||||
}),
|
||||
...(isDev
|
||||
? [
|
||||
hotReloadExtension({
|
||||
log: true,
|
||||
backgroundPath: "src/pages/background/index.ts",
|
||||
}),
|
||||
]
|
||||
: []),
|
||||
],
|
||||
build: {
|
||||
...baseBuildOptions,
|
||||
outDir,
|
||||
...(isDev
|
||||
? {
|
||||
rollupOptions: {
|
||||
output: {
|
||||
entryFileNames: "assets/[name].js",
|
||||
chunkFileNames: "assets/[name].js",
|
||||
assetFileNames: "assets/[name][extname]",
|
||||
},
|
||||
},
|
||||
}
|
||||
: {}),
|
||||
},
|
||||
}),
|
||||
);
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
import { resolve } from 'path';
|
||||
import { mergeConfig, defineConfig } from 'vite';
|
||||
import { crx, ManifestV3Export } from '@crxjs/vite-plugin';
|
||||
import baseConfig, { baseManifest, baseBuildOptions } from './vite.config.base'
|
||||
|
||||
const outDir = resolve(__dirname, 'dist_firefox');
|
||||
|
||||
export default mergeConfig(
|
||||
baseConfig,
|
||||
defineConfig({
|
||||
plugins: [
|
||||
crx({
|
||||
manifest: {
|
||||
...baseManifest,
|
||||
background: {
|
||||
scripts: [ 'src/pages/background/index.ts' ]
|
||||
},
|
||||
} as ManifestV3Export,
|
||||
browser: 'firefox',
|
||||
contentScripts: {
|
||||
injectCss: true,
|
||||
}
|
||||
})
|
||||
],
|
||||
build: {
|
||||
...baseBuildOptions,
|
||||
outDir
|
||||
},
|
||||
publicDir: resolve(__dirname, 'public'),
|
||||
})
|
||||
)
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
'use client';
|
||||
|
||||
import { ReactNode } from 'react';
|
||||
import { PreviewWrapper } from '@gitroom/frontend/components/preview/preview.wrapper';
|
||||
import { usePathname } from 'next/navigation';
|
||||
import dayjs from 'dayjs';
|
||||
import utc from 'dayjs/plugin/utc';
|
||||
dayjs.extend(utc);
|
||||
|
||||
export default async function AppLayout({ children }: { children: ReactNode, params: any }) {
|
||||
const params = usePathname();
|
||||
const style = params.split('/').pop();
|
||||
return (
|
||||
<div className={`hideCopilot ${style} h-[100vh] !padding-[50px] w-full text-textColor flex flex-col !bg-none`}>
|
||||
<style>
|
||||
{`
|
||||
#add-edit-modal, .hideCopilot {
|
||||
background: transparent !important;
|
||||
}
|
||||
html body.dark, html {
|
||||
background: transparent !important;
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
<PreviewWrapper>{children}</PreviewWrapper>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import { StandaloneModal } from '@gitroom/frontend/components/standalone-modal/standalone.modal';
|
||||
|
||||
export default async function Modal() {
|
||||
return (
|
||||
<div className="text-textColor">
|
||||
<StandaloneModal />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -462,3 +462,7 @@ div div .set-font-family {
|
|||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.hideCopilot .copilotKitPopup {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
@ -28,7 +28,7 @@ export default async function AppLayout({ children }: { children: ReactNode }) {
|
|||
<head>
|
||||
<link rel="icon" href="/favicon.ico" sizes="any" />
|
||||
</head>
|
||||
<body className={clsx(chakra.className, 'text-primary !bg-primary')}>
|
||||
<body className={clsx(chakra.className, 'dark text-primary !bg-primary')}>
|
||||
<VariableContextComponent
|
||||
storageProvider={
|
||||
process.env.STORAGE_PROVIDER! as 'local' | 'cloudflare'
|
||||
|
|
|
|||
|
|
@ -75,13 +75,23 @@ export const AddEditModal: FC<{
|
|||
allIntegrations?: Integrations[];
|
||||
reopenModal: () => void;
|
||||
mutate: () => void;
|
||||
padding?: string;
|
||||
customClose?: () => void;
|
||||
onlyValues?: Array<{
|
||||
content: string;
|
||||
id?: string;
|
||||
image?: Array<{ id: string; path: string }>;
|
||||
}>;
|
||||
}> = memo((props) => {
|
||||
const { date, integrations: ints, reopenModal, mutate, onlyValues } = props;
|
||||
const {
|
||||
date,
|
||||
integrations: ints,
|
||||
reopenModal,
|
||||
mutate,
|
||||
onlyValues,
|
||||
padding,
|
||||
customClose,
|
||||
} = props;
|
||||
const [customer, setCustomer] = useState('');
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [uploading, setUploading] = useState(false);
|
||||
|
|
@ -292,6 +302,10 @@ export const AddEditModal: FC<{
|
|||
'Yes, close it!'
|
||||
)
|
||||
) {
|
||||
if (customClose) {
|
||||
customClose();
|
||||
return;
|
||||
}
|
||||
modal.closeAll();
|
||||
}
|
||||
}, [canUseClose]);
|
||||
|
|
@ -441,6 +455,12 @@ export const AddEditModal: FC<{
|
|||
? 'Added successfully'
|
||||
: 'Updated successfully'
|
||||
);
|
||||
|
||||
if (customClose) {
|
||||
setTimeout(() => {
|
||||
customClose();
|
||||
}, 5000);
|
||||
}
|
||||
modal.closeAll();
|
||||
},
|
||||
[
|
||||
|
|
@ -573,6 +593,7 @@ Here are the things you can do:
|
|||
className={clsx(
|
||||
'flex flex-col md:flex-row p-[10px] rounded-[4px] bg-primary gap-[20px]'
|
||||
)}
|
||||
style={{ padding }}
|
||||
>
|
||||
{uploading && (
|
||||
<div className="absolute left-0 top-0 w-full h-full bg-black/40 z-[600] flex justify-center items-center">
|
||||
|
|
|
|||
|
|
@ -5,9 +5,13 @@ import { ContextWrapper } from '@gitroom/frontend/components/layout/user.context
|
|||
import { ReactNode, useCallback } from 'react';
|
||||
import { useFetch } from '@gitroom/helpers/utils/custom.fetch';
|
||||
import { Toaster } from '@gitroom/react/toaster/toaster';
|
||||
import { MantineWrapper } from '@gitroom/react/helpers/mantine.wrapper';
|
||||
import { useVariables } from '@gitroom/react/helpers/variable.context';
|
||||
import { CopilotKit } from '@copilotkit/react-core';
|
||||
|
||||
export const PreviewWrapper = ({ children }: { children: ReactNode }) => {
|
||||
const fetch = useFetch();
|
||||
const { backendUrl } = useVariables();
|
||||
|
||||
const load = useCallback(async (path: string) => {
|
||||
return await (await fetch(path)).json();
|
||||
|
|
@ -23,8 +27,15 @@ export const PreviewWrapper = ({ children }: { children: ReactNode }) => {
|
|||
|
||||
return (
|
||||
<ContextWrapper user={user}>
|
||||
<Toaster />
|
||||
{children}
|
||||
<CopilotKit
|
||||
credentials="include"
|
||||
runtimeUrl={backendUrl + '/copilot/chat'}
|
||||
>
|
||||
<MantineWrapper>
|
||||
<Toaster />
|
||||
{children}
|
||||
</MantineWrapper>
|
||||
</CopilotKit>
|
||||
</ContextWrapper>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,41 @@
|
|||
'use client';
|
||||
import 'reflect-metadata';
|
||||
|
||||
import { FC, useCallback } from 'react';
|
||||
import useSWR from 'swr';
|
||||
import { useFetch } from '@gitroom/helpers/utils/custom.fetch';
|
||||
import { AddEditModal } from '@gitroom/frontend/components/launches/add.edit.model';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
export const StandaloneModal: FC = () => {
|
||||
const fetch = useFetch();
|
||||
const load = useCallback(async (path: string) => {
|
||||
return (await (await fetch(path)).json()).integrations;
|
||||
}, []);
|
||||
|
||||
const {
|
||||
isLoading,
|
||||
data: integrations,
|
||||
mutate,
|
||||
} = useSWR('/integrations/list', load, {
|
||||
fallbackData: [],
|
||||
});
|
||||
|
||||
if (isLoading) {
|
||||
return <div className="w-full h-full flex items-center justify-center">Loading...</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<AddEditModal
|
||||
customClose={() => {
|
||||
window.parent.postMessage({ action: 'closeIframe' }, '*');
|
||||
}}
|
||||
padding="50px"
|
||||
mutate={() => {}}
|
||||
integrations={integrations}
|
||||
reopenModal={() => {}}
|
||||
allIntegrations={integrations}
|
||||
date={dayjs()}
|
||||
/>
|
||||
);
|
||||
};
|
||||
12
package.json
12
package.json
|
|
@ -11,7 +11,7 @@
|
|||
},
|
||||
"packageManager": "pnpm@10.6.1",
|
||||
"scripts": {
|
||||
"dev": "pnpm run --filter ./apps/workers --filter ./apps/backend --filter ./apps/frontend --parallel dev",
|
||||
"dev": "pnpm run --filter ./apps/extension --filter ./apps/workers --filter ./apps/backend --filter ./apps/frontend --parallel dev",
|
||||
"pm2": "pnpx concurrently \"pnpm run pm2-run\" \"pnpm run entryfile\"",
|
||||
"entryfile": "./entrypoint.sh",
|
||||
"pm2-run": "pm2 delete all || true && pnpm run prisma-db-push && pnpm run --parallel pm2 && pm2 logs",
|
||||
|
|
@ -141,6 +141,7 @@
|
|||
"fast-xml-parser": "^4.5.1",
|
||||
"google-auth-library": "^9.11.0",
|
||||
"googleapis": "^137.1.0",
|
||||
"hot-reload-extension-vite": "^1.0.13",
|
||||
"ioredis": "^5.3.2",
|
||||
"json-to-graphql-query": "^2.2.5",
|
||||
"jsonwebtoken": "^9.0.2",
|
||||
|
|
@ -195,12 +196,14 @@
|
|||
"utf-8-validate": "^5.0.10",
|
||||
"uuid": "^10.0.0",
|
||||
"viem": "^2.22.9",
|
||||
"webextension-polyfill": "^0.12.0",
|
||||
"ws": "^8.18.0",
|
||||
"yargs": "^17.7.2",
|
||||
"yup": "^1.4.0",
|
||||
"zod": "^3.24.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@crxjs/vite-plugin": "^2.0.0-beta.32",
|
||||
"@nestjs/schematics": "^10.0.1",
|
||||
"@nestjs/testing": "^10.0.2",
|
||||
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.7",
|
||||
|
|
@ -208,8 +211,10 @@
|
|||
"@swc-node/register": "1.9.2",
|
||||
"@swc/cli": "0.3.14",
|
||||
"@swc/core": "1.5.7",
|
||||
"@tailwindcss/vite": "^4.0.17",
|
||||
"@testing-library/react": "15.0.6",
|
||||
"@types/cache-manager-redis-store": "^2.0.4",
|
||||
"@types/chrome": "^0.0.319",
|
||||
"@types/cookie-parser": "^1.4.6",
|
||||
"@types/jest": "29.5.12",
|
||||
"@types/node": "18.16.9",
|
||||
|
|
@ -217,6 +222,7 @@
|
|||
"@types/react": "18.3.1",
|
||||
"@types/react-dom": "18.3.0",
|
||||
"@types/uuid": "^9.0.8",
|
||||
"@types/webextension-polyfill": "^0.12.3",
|
||||
"@types/yargs": "^17.0.32",
|
||||
"@typescript-eslint/eslint-plugin": "7.18.0",
|
||||
"@typescript-eslint/parser": "7.18.0",
|
||||
|
|
@ -232,21 +238,25 @@
|
|||
"eslint-plugin-jsx-a11y": "6.7.1",
|
||||
"eslint-plugin-react": "7.32.2",
|
||||
"eslint-plugin-react-hooks": "4.6.0",
|
||||
"fs-extra": "^11.3.0",
|
||||
"jest": "29.7.0",
|
||||
"jest-environment-jsdom": "29.7.0",
|
||||
"jest-environment-node": "^29.4.1",
|
||||
"jest-junit": "^16.0.0",
|
||||
"jest-mock-extended": "^4.0.0-beta1",
|
||||
"jsdom": "~22.1.0",
|
||||
"nodemon": "^3.1.9",
|
||||
"postcss": "8.4.38",
|
||||
"prettier": "^2.6.2",
|
||||
"prisma": "^6.5.0",
|
||||
"react-refresh": "^0.10.0",
|
||||
"sass": "1.62.1",
|
||||
"tailwindcss": "^4.1.5",
|
||||
"ts-jest": "^29.1.0",
|
||||
"ts-node": "10.9.2",
|
||||
"typescript": "5.5.4",
|
||||
"vite": "^5.0.0",
|
||||
"vite-tsconfig-paths": "^5.1.4",
|
||||
"vitest": "1.6.0"
|
||||
},
|
||||
"volta": {
|
||||
|
|
|
|||
842
pnpm-lock.yaml
842
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
|
@ -32,7 +32,8 @@
|
|||
"@gitroom/nestjs-libraries/*": ["libraries/nestjs-libraries/src/*"],
|
||||
"@gitroom/react/*": ["libraries/react-shared-libraries/src/*"],
|
||||
"@gitroom/plugins/*": ["libraries/plugins/src/*"],
|
||||
"@gitroom/workers/*": ["apps/workers/src/*"]
|
||||
"@gitroom/workers/*": ["apps/workers/src/*"],
|
||||
"@gitroom/extension/*": ["apps/extension/src/*"]
|
||||
}
|
||||
},
|
||||
"exclude": ["node_modules", "tmp"]
|
||||
|
|
|
|||
Loading…
Reference in New Issue