Muitos plugins WordPress podem ser portados para o EmDash. O modelo é diferente—TypeScript em vez de PHP, hooks em vez de actions/filters, armazenamento estruturado em vez de wp_options—mas a maior parte do comportamento mapeia bem.
Avaliação de portabilidade
Nem todo plugin vale a pena portar. Avalie candidatos antes de começar.
Bons candidatos
Campos personalizados, SEO, processadores de conteúdo, extensões da UI de administração, analytics, redes sociais, formulários
Maus candidatos
Recursos multisite, integrações WooCommerce/Gutenberg, plugins que alteram o núcleo do WordPress
Comparação de estrutura
WordPress
wp-content/plugins/my-plugin/
├── my-plugin.php # Main file with plugin header
├── includes/
│ ├── class-admin.php
│ └── class-api.php
└── admin/
└── js/ EmDash
my-plugin/
├── src/
│ ├── index.ts # Plugin definition (definePlugin)
│ └── admin.tsx # Admin UI exports (React)
├── package.json
└── tsconfig.json Mapeamento de hooks
O WordPress usa add_action() e add_filter() com nomes de hook em string. O EmDash usa hooks tipados na definição do plugin.
Hooks de ciclo de vida
| WordPress | EmDash | Notas |
|---|---|---|
register_activation_hook() | plugin:install | Uma vez na primeira instalação |
| Plugin ativado | plugin:activate | Ao ativar |
| Plugin desativado | plugin:deactivate | Ao desativar |
register_uninstall_hook() | plugin:uninstall | event.deleteData indica escolha do usuário |
Hooks de conteúdo
| WordPress | EmDash | Notas |
|---|---|---|
wp_insert_post_data | content:beforeSave | Devolver conteúdo alterado ou lançar para cancelar |
save_post | content:afterSave | Efeitos após guardar |
before_delete_post | content:beforeDelete | Devolver false para cancelar |
deleted_post | content:afterDelete | Limpeza após eliminar |
WordPress
add_action('save_post', function($post_id, $post, $update) {
if ($post->post_type !== 'product') return;
$price = get_post_meta($post_id, 'price', true);
if ($price > 1000) {
update_post_meta($post_id, 'is_premium', true);
}
}, 10, 3);
EmDash
hooks: {
"content:afterSave": async (event, ctx) => {
if (event.collection !== "products") return;
const price = event.content.price as number;
if (price > 1000) {
await ctx.kv.set(`premium:${event.content.id}`, true);
}
},
} Hooks de media
| WordPress | EmDash | Notas |
|---|---|---|
wp_handle_upload_prefilter | media:beforeUpload | Validar ou transformar |
add_attachment | media:afterUpload | Após o upload |
Mapeamento de armazenamento
API de opções → armazém KV
WordPress
$api_key = get_option('my_plugin_api_key', '');
update_option('my_plugin_api_key', 'abc123');
delete_option('my_plugin_api_key'); EmDash
const apiKey = await ctx.kv.get<string>("settings:apiKey") ?? "";
await ctx.kv.set("settings:apiKey", "abc123");
await ctx.kv.delete("settings:apiKey"); Tabelas personalizadas → coleções de storage
WordPress
global $wpdb;
$table = $wpdb->prefix . 'my_plugin_items';
// Insert
$wpdb->insert($table, ['name' => 'Item 1', 'status' => 'active']);
// Query
$items = $wpdb->get_results(
"SELECT \* FROM $table WHERE status = 'active' LIMIT 10"
);
EmDash
// Declare in plugin definition
storage: {
items: {
indexes: ["status", "createdAt"],
},
},
// In hooks or routes:
await ctx.storage.items.put("item-1", {
name: "Item 1",
status: "active",
createdAt: new Date().toISOString(),
});
const result = await ctx.storage.items.query({
where: { status: "active" },
limit: 10,
}); Esquema de definições
O WordPress usa a Settings API para formulários de admin. O EmDash usa um esquema declarativo que gera a UI automaticamente.
WordPress
add_action('admin_init', function() {
register_setting('my_plugin', 'my_plugin_api_key');
add_settings_section('main', 'Settings', null, 'my-plugin');
add_settings_field('api_key', 'API Key', function() {
$value = get_option('my_plugin_api_key');
echo '<input type="text" name="my_plugin_api_key"
value="' . esc_attr($value) . '">';
}, 'my-plugin', 'main');
}); EmDash
admin: {
settingsSchema: {
apiKey: {
type: "secret",
label: "API Key",
description: "Your API key from the dashboard",
},
enabled: {
type: "boolean",
label: "Enabled",
default: true,
},
limit: {
type: "number",
label: "Item Limit",
default: 100,
min: 1,
max: 1000,
},
},
} UI de administração
As páginas de admin WordPress são PHP. O EmDash usa componentes React.
import { useState, useEffect } from "react";
export const widgets = {
summary: function SummaryWidget() {
const [count, setCount] = useState(0);
useEffect(() => {
fetch("/_emdash/api/plugins/my-plugin/status")
.then((r) => r.json())
.then((data) => setCount(data.count));
}, []);
return <div>Total items: {count}</div>;
},
};
export const pages = {
settings: function SettingsPage() {
// React component for settings page
return <div>Settings content</div>;
},
};
Registe na definição do plugin:
admin: {
entry: "@my-org/my-plugin/admin",
pages: [{ path: "/settings", label: "Dashboard" }],
widgets: [{ id: "summary", title: "Summary", size: "half" }],
},
REST API → rotas do plugin
WordPress
register_rest_route('my-plugin/v1', '/items', [
'methods' => 'GET',
'callback' => function($request) {
global $wpdb;
$items = $wpdb->get_results("SELECT * FROM items LIMIT 50");
return new WP_REST_Response($items);
},
]); EmDash
routes: {
items: {
handler: async (ctx) => {
const result = await ctx.storage.items.query({ limit: 50 });
return { items: result.items };
},
},
}, As rotas ficam em /_emdash/api/plugins/{plugin-id}/{route-name}.
Processo de portagem
-
Analisar o plugin WordPress
Documente hooks, acesso à base de dados, páginas admin, endpoints REST.
-
Mapear para conceitos EmDash
Hooks WordPress → hooks EmDash.
wp_options→ctx.kv. Tabelas próprias → coleções storage. Páginas admin → React. REST → rotas do plugin. -
Criar o esqueleto
import { definePlugin } from "emdash"; export function createPlugin() { return definePlugin({ id: "my-ported-plugin", version: "1.0.0", capabilities: [], storage: {}, hooks: {}, routes: {}, admin: {}, }); } -
Ordem de implementação
Storage → Hooks → UI admin → Rotas
-
Testar bem
Verifique disparo de hooks, storage e renderização da UI.
Exemplo: plugin de tempo de leitura
WordPress
add_filter('wp_insert_post_data', function($data, $postarr) {
if ($data['post_type'] !== 'post') return $data;
$content = strip_tags($data['post_content']);
$word_count = str_word_count($content);
$read_time = ceil($word_count / 200);
if (!empty($postarr['ID'])) {
update_post_meta($postarr['ID'], '_read_time', $read_time);
}
return $data;
}, 10, 2);
EmDash
export function createPlugin() {
return definePlugin({
id: "read-time",
version: "1.0.0",
admin: {
settingsSchema: {
wordsPerMinute: {
type: "number",
label: "Words per minute",
default: 200,
min: 100,
max: 400,
},
},
},
hooks: {
"content:beforeSave": async (event, ctx) => {
if (event.collection !== "posts") return;
const wpm = await ctx.kv.get<number>("settings:wordsPerMinute") ?? 200;
const text = JSON.stringify(event.content.body || "");
const readTime = Math.ceil(text.split(/\s+/).length / wpm);
return { ...event.content, readTime };
},
},
});
} Capabilities
Os plugins devem declarar as capabilities necessárias para a sandbox de segurança:
| Capability | Fornece | Caso de uso |
|---|---|---|
network:fetch | ctx.http.fetch() | Chamadas API externas |
read:content | ctx.content.get(), list() | Ler conteúdo CMS |
write:content | ctx.content.create(), etc. | Alterar conteúdo |
read:media | ctx.media.get(), list() | Ler media |
write:media | ctx.media.getUploadUrl() | Enviar media |
Armadilhas comuns
Sem estado global — Use storage em vez de variáveis globais.
Tudo assíncrono — Sempre await em storage e chamadas API.
Sem SQL direto — Use coleções de storage estruturadas.
Sem sistema de ficheiros — Use a API de media para ficheiros.
Próximos passos
- Hooks Reference — Todos os hooks com assinaturas
- Storage API — Coleções e consultas
- Settings — Esquema e armazém KV
- Admin UI — Construir páginas de administração