Skip to content

Instantly share code, notes, and snippets.

View liady's full-sized avatar

Liad Yosef liady

View GitHub Profile
async function callTool(server, toolName, toolParams) {
let mcpSessionId = null;
try {
const response = await fetch(server, {
method: "POST",
headers: {
"Content-Type": "application/json",
accept: "application/json text/event-stream",
},
body: JSON.stringify({
@liady
liady / adaptivestyling.jsx
Last active August 4, 2025 20:23 — forked from iregina/adaptivestyling.js
Adaptive styling
const customCss = `
shopify-product-card::part(product-title) {
font-weight: 600;
}
`;
iframe.contentWindow.postMessage({
type: "ui-lifecycle-iframe-render-data",
payload: {
renderData: {
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>MCP-UI Proxy</title>
<style>
html,
body {
margin: 0;
height: 100vh;
@liady
liady / index.html
Last active July 17, 2025 20:52
CSP iframe
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css" />
<meta
http-equiv="Content-Security-Policy"
content="frame-src http://localhost:3000"
/>
</head>
<body>
import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { createUIResource } from "@mcp-ui/server";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
const server = new McpServer({
name: "mcp-ui-example",
version: "0.0.1",
});
server.tool(
import { useCallback , useState } from "react";
import { UiActionResult, HtmlResource } from "@mcp-ui/client";
function UIResponseWrapper({ addToChat, url }: { addToChat: (message: any) => void, url: string }) {
const [resourceStyle, setResourceStyle] = useState({
height: "100px",
width: "100px",
});
const handleUiAction = useCallback(
<html><body>
<script src="https://cdn.shopify.com/storefront/web-components.js">
</script>
<!-- Provide the token and set the market context -->
<shopify-store store-domain="mock.shop" country="US" language="en"></shopify-store>
<div class="product-layout">
<div class="product-card">
<!-- Set product you want to display -->
<shopify-context type="product" handle="{{PRODUCT_ID}}">
@liady
liady / vscode-types-settings.json
Last active May 20, 2022 21:22
Color settings for dimming type annotations in VSCode, change "foreground" as you wish
{
"editor.semanticHighlighting.enabled": false,
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": [
"support.type.primitive.ts",
"entity.name.type.ts",
"meta.type.tuple.ts",
"meta.type.annotation.ts",
@liady
liady / lockBower.js
Last active November 8, 2017 22:42
Node script for creating a 'bower-lock.json' with exact versions
const fs = require('fs');
const path = require('path');
const resolve = (...args) => path.join(__dirname, ...args);
const lockedVersions = getPackageVersions(resolve('bower_components'));
const newBowerContents = buildNewBowerContents(lockedVersions);
console.log(`Writing to bower-lock.json`);
fs.writeFileSync(resolve('./bower-lock.json'), newBowerContents, 'utf8');
@liady
liady / ultimate-ut-cheat-sheet.md
Created April 13, 2017 23:20 — forked from yoavniran/ultimate-ut-cheat-sheet.md
The Ultimate Unit Testing Cheat-sheet For Mocha, Chai and Sinon

The Ultimate Unit Testing Cheat-sheet

For Mocha, Chai and Sinon

using mocha/chai/sinon for node.js unit-tests? check out my utility: mocha-stirrer to easily reuse test components and mock require dependencies