Skip to content

Instantly share code, notes, and snippets.

Avatar
💭
It's full of stars

Rene Rubalcava odoe

💭
It's full of stars
View GitHub Profile
View Profile.ts
// tests/unit/widgets/Profile.ts
const { describe, it } = intern.getInterface("bdd");
import harness from "@dojo/framework/testing/harness";
import { w, v } from "@dojo/framework/widget-core/d";
import Profile from "../../../src/widgets/Profile";
import * as css from "../../../src/widgets/styles/Profile.m.css";
describe("Profile", () => {
it("default renders correctly", () => {
const h = harness(() => w(Profile, { username: "Dojo User" }));
h.expect(() => v("h1", { classes: [css.root] }, ["Welcome Dojo User!"]));
View imagebase64.block.ts
import { resolve } from 'path';
import { v } from '@dojo/framework/widget-core/d';
import * as sharp from 'sharp';
export default async function (path: string) {
path = resolve(__dirname, path);
// resize my images
const images = [
await sharp(path).resize(200).toBuffer(),
await sharp(path).resize(300).toBuffer(),
await sharp(path).resize(400).toBuffer(),
View AboutWidget.tsx
import WidgetBase from "@dojo/framework/widget-core/WidgetBase";
import { dom } from "@dojo/framework/widget-core/d";
import Block from "@dojo/framework/widget-core/meta/Block";
import { tsx } from "@dojo/framework/widget-core/tsx";
import fromMarkdown from "../blocks/markdown.block";
import * as css from "./styles/About.m.css";
export default class About extends WidgetBase {
protected render() {
const node = document.createElement("div");
// Use my block
View markdown.block.ts
import * as fs from 'fs';
import { resolve } from 'path';
import { Converter } from 'showdown';
const mdConverter = new Converter();
export default function (path: string) {
path = resolve(__dirname, path);
const file = fs.readFileSync(path, 'utf8');
// convert Markdown to HTML
const html = mdConverter.makeHtml(file);
return html
View APIExplorerContainer.ts
import { Store } from "@dojo/framework/stores/Store";
import { StoreContainer } from "@dojo/framework/stores/StoreInjector";
import { APIExplorer } from "../widgets/APIExplorer";
import { State } from "../interfaces";
import {
fetchItemsProcess,
fetchResultProcess
} from "../processes/starwarsProcesses";
View main.tsx
const store = new Store();
const registry = registerStoreInjector(store);
class App extends WidgetBase {
protected render() {
return <APIExplorerContainer />;
}
}
const r = renderer(() => <App />);
View starwarsProcesses.ts
export const fetchItemsProcess = createProcess("fetch-items", [fetchItems]);
export const fetchResultProcess = createProcess("fetch-result", [fetchResult]);
View starwarsProcesses.ts
const fetchResult = commandFactory<Item>(async ({ path, payload }) => {
const response = await fetch(payload.value);
const result = await response.json();
return [replace(path("result"), JSON.stringify(result, undefined, 2))];
});
View starwarsProcesses.ts
const fetchItems = commandFactory<Item>(async ({ path }) => {
const response = await fetch("https://swapi.co/api/");
const json = await response.json();
const items: Item[] = Object.keys(json).map(key => {
return {
label: key,
value: json[key]
};
});
return [replace(path("items"), items)];
View starwarsProcesses.ts
import {
createProcess,
createCommandFactory
} from "@dojo/framework/stores/process";
import { replace } from "@dojo/framework/stores/state/operations";
import { State, Item } from "../interfaces";
// commandFactory typed to my application state
const commandFactory = createCommandFactory<State>();
You can’t perform that action at this time.