rzh9b
rzh9b
DDeno
Created by rzh9b on 6/17/2024 in #help
onClick not staying with preact-render-to-string?
Hello, I'm trying to make an SSR application by rendering components to strings. However, I need a button to have some JavaScript capabilities and unfortunately Preact seems to be removing it. How can I work around this? I'd like to continue rendering it to a string if possible. Thanks!
9 replies
DDeno
Created by rzh9b on 1/25/2023 in #help
write map to .ts file
how would i write a Map object to a .ts file?
4 replies
DDeno
Created by rzh9b on 1/16/2023 in #help
[react] document is not defined
the following code returns document is not defined. i have no idea how i'd go about fixing this. the example uses next.js' dynamic() but i'm doing this in "plain" react. any ideas? thanks!
import { NotionAPI } from "https://esm.sh/notion-client@6.15.6";
import { NotionRenderer } from "https://esm.sh/react-notion-x@6.15.7";

import { Collection } from 'https://esm.sh/react-notion-x/build/third-party/collection'

import { React, Suspense, ReactDOMServer, DOMParser } from "../deps.ts";

const notion = new NotionAPI();
const recordMap = await notion.getPage("f675efad218a4aea85546c036957f3f8");

export default function App (){
return (
<NotionRenderer recordMap={recordMap} fullPage={true} darkMode={true} components={{Collection}} />
)
}
import { NotionAPI } from "https://esm.sh/notion-client@6.15.6";
import { NotionRenderer } from "https://esm.sh/react-notion-x@6.15.7";

import { Collection } from 'https://esm.sh/react-notion-x/build/third-party/collection'

import { React, Suspense, ReactDOMServer, DOMParser } from "../deps.ts";

const notion = new NotionAPI();
const recordMap = await notion.getPage("f675efad218a4aea85546c036957f3f8");

export default function App (){
return (
<NotionRenderer recordMap={recordMap} fullPage={true} darkMode={true} components={{Collection}} />
)
}
18 replies
DDeno
Created by rzh9b on 1/16/2023 in #help
react-notion-x usememo error?
3 replies
DDeno
Created by rzh9b on 1/14/2023 in #help
adding async data to array?
i'm probably missing something obvious but i'm trying to add data that's async to an array in a forEach loop. below is my code:
const posts = await notion.databases.query({
database_id: Deno.env.get("DATABASE_ID"),
sorts: [
{
property: "Date",
direction: "descending"
}
]
})

const posts_array: Array<Record<string, unknown>> = [];

posts.results.forEach(async post => {
const title = post.properties.Title.title[0].text.content, date = post.properties.Date.date.start, id = post.id;
const content = await notion.blocks.children.list({ block_id: id, page_size: 100 });
const post_data = { title: title, date: date, content: content.results };
posts_array.push(post_data);
})
const posts = await notion.databases.query({
database_id: Deno.env.get("DATABASE_ID"),
sorts: [
{
property: "Date",
direction: "descending"
}
]
})

const posts_array: Array<Record<string, unknown>> = [];

posts.results.forEach(async post => {
const title = post.properties.Title.title[0].text.content, date = post.properties.Date.date.start, id = post.id;
const content = await notion.blocks.children.list({ block_id: id, page_size: 100 });
const post_data = { title: title, date: date, content: content.results };
posts_array.push(post_data);
})
apologies for the formatting
3 replies
DDeno
Created by rzh9b on 11/15/2022 in #help
preact form not working?
hi all, i'm just trying to make a simple form but for some reason it keeps submitting the form as if there's no onSubmit function... inputbar.jsx
/** @jsx h */

import { h, Component } from "https://esm.sh/preact";

export default class InputBar extends Component {
state = { value: '' }

onSubmit = e => {
console.log("submit");
e.preventDefault();
}

onInput = e => {
const { value } = e.target;
this.setState({ value });
}

render(_, { value }) {
return (
<div>
<form onSubmit={this.onSubmit}>
<input type="text" placeholder="enter your RSS URL" name="import" value={value} onInput={this.onInput}/>
<button type="submit" style="visibility: hidden"></button>
</form>
<br/>
<br/>
<details>
<summary>your feeds</summary>
<div>feed list</div>
</details>
</div>
)
}
}
/** @jsx h */

import { h, Component } from "https://esm.sh/preact";

export default class InputBar extends Component {
state = { value: '' }

onSubmit = e => {
console.log("submit");
e.preventDefault();
}

onInput = e => {
const { value } = e.target;
this.setState({ value });
}

render(_, { value }) {
return (
<div>
<form onSubmit={this.onSubmit}>
<input type="text" placeholder="enter your RSS URL" name="import" value={value} onInput={this.onInput}/>
<button type="submit" style="visibility: hidden"></button>
</form>
<br/>
<br/>
<details>
<summary>your feeds</summary>
<div>feed list</div>
</details>
</div>
)
}
}
root.ksx
/** @jsx h */
/* https://todo.sr.ht/~jordanreger/feeds/5 */

import InputBar from "./inputbar.jsx";
import FeedList from "./feedlist.jsx";

import { h } from "https://esm.sh/preact";
import { render } from "https://esm.sh/preact-render-to-string";

const root = `
<!DOCTYPE html>
<html lang="en">
...
<article>
<div class="body">
feeds is a very basic rss reader. view the source on <a href="https://git.sr.ht/~jordanreger/feeds">sourcehut</a>.
<br/>
(for links that don't work, please add an issue to <a href="https://todo.sr.ht/~jordanreger/feeds" target="_blank">todo.sr.ht/~jordanreger/feeds</a>)
<br/>
<br/>
${render(<InputBar/>)}
</div>
</article>
...
</html>

`;

export { root as page_root };
/** @jsx h */
/* https://todo.sr.ht/~jordanreger/feeds/5 */

import InputBar from "./inputbar.jsx";
import FeedList from "./feedlist.jsx";

import { h } from "https://esm.sh/preact";
import { render } from "https://esm.sh/preact-render-to-string";

const root = `
<!DOCTYPE html>
<html lang="en">
...
<article>
<div class="body">
feeds is a very basic rss reader. view the source on <a href="https://git.sr.ht/~jordanreger/feeds">sourcehut</a>.
<br/>
(for links that don't work, please add an issue to <a href="https://todo.sr.ht/~jordanreger/feeds" target="_blank">todo.sr.ht/~jordanreger/feeds</a>)
<br/>
<br/>
${render(<InputBar/>)}
</div>
</article>
...
</html>

`;

export { root as page_root };
5 replies
DDeno
Created by rzh9b on 11/6/2022 in #help
split error when using std toml
here's the error:
$ deno run -A toml.ts
error: Uncaught (in promise) TypeError: subStr.split is not a function
const lines = subStr.split("\n");
^
at parse (https://deno.land/std@0.162.0/encoding/_toml/parser.ts:873:28)
at file:///C:/Users/jorda/crate/playground/toml.ts:5:13
$ deno run -A toml.ts
error: Uncaught (in promise) TypeError: subStr.split is not a function
const lines = subStr.split("\n");
^
at parse (https://deno.land/std@0.162.0/encoding/_toml/parser.ts:873:28)
at file:///C:/Users/jorda/crate/playground/toml.ts:5:13
1 replies
DDeno
Created by rzh9b on 11/4/2022 in #help
turn off js with fetch?
i'd like to fetch only the html version of a website, if there is one. any ideas on how to do so?
4 replies
DDeno
Created by rzh9b on 11/4/2022 in #help
package to turn html into plaintext?
i want to try turning html pages into plaintext in the terminal. any ideas?
18 replies