Skip to content

Commit afb27b2

Browse files
dwjohnstonCopilot
dwjohnston
and
Copilot
authored
Fix syntax highlighting. (#73)
* Fix syntax highlighting issue by not specifying the language. Fix syntax highlighting for React/TypeScript files by adding language detection Co-authored-by: dwjohnston <[email protected]> Add React TSX syntax highlighting demo story and verify fix works Co-authored-by: dwjohnston <[email protected]> Sample tsx Just don't set the language Get rid of 'getLanguageFromPath' stuff * Fix storybook to provide a github token. * Provide a list of supported langauges. * Fix syntax highlighting for React/TypeScript files by adding language detection Co-authored-by: dwjohnston <[email protected]> * Add more sample files * Put detecting language based on file name back in. * Doc * Create rare-gifts-sip.md --------- Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: dwjohnston <[email protected]>
1 parent bc75e8f commit afb27b2

18 files changed

+763
-187
lines changed

‎.changeset/rare-gifts-sip.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
"react-github-permalink": minor
3+
---
4+
5+
Switch style provider from HLJS to Prism. (Prism supports TSX).
6+
7+
Auto detect language based on file extension.
8+
9+
Adds a `language` prop to override any auto-detection behaviour.

‎.env.template‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
STORYBOOK_GITHUB_TOKEN=${GITHUB_TOKEN_READONLY}

‎.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
.pnp.js
77
.yarn/install-state.gz
88

9+
.env
10+
911
# testing
1012
/coverage
1113

‎.storybook/preview.ts‎

Lines changed: 0 additions & 15 deletions
This file was deleted.

‎.storybook/preview.tsx‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import type { Preview } from "@storybook/react";
2+
import './global.css';
3+
import { GithubPermalinkProvider } from "../src/library/config/GithubPermalinkContext";
4+
5+
const preview: Preview = {
6+
parameters: {
7+
controls: {
8+
matchers: {
9+
color: /(background|color)$/i,
10+
date: /Date$/i,
11+
},
12+
},
13+
},
14+
decorators: [(Story) => (
15+
<div style={{ margin: '3em' }} >
16+
<GithubPermalinkProvider githubToken={process.env.STORYBOOK_GITHUB_TOKEN}>
17+
<Story />
18+
</GithubPermalinkProvider>
19+
</div>)]
20+
};
21+
22+
export default preview;

‎README.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,15 @@ I highly rate the [`vscode-copy-github-permalink` plugin](https://marketplace.vi
2121
https://codesandbox.io/s/exciting-nova-js5zlk?file=/src/App.js
2222

2323

24+
## Language Support
25+
26+
Langauge is naively auto detected based on file extension. See [logic here for all auto-detected languages](https://github.com/dwjohnston/react-github-permalink/pull/73/files#diff-b6feb43e40d6eae1cba733450d691be8f83a1a50ecbff1b890cd343b2039ece1).
27+
28+
If this does not suit you, you can override the autodetected langauage with the `language` prop.
29+
30+
31+
32+
2433
## RSC Compatibility / Three modes of operation
2534

2635
This package is compatible with Next 13+ and the components can be used as RSCs if you wish.

‎sample_files/sample.dockerfile‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# Use an official Node.js runtime as a parent image
2+
FROM node:18-alpine
3+
4+
# Set the working directory
5+
WORKDIR /app
6+
7+
# Copy package.json and package-lock.json
8+
COPY package*.json ./
9+
10+
# Install dependencies
11+
RUN npm install
12+
13+
# Copy the rest of the application code
14+
COPY . .
15+
16+
# Expose the app port
17+
EXPOSE 3000
18+
19+
# Start the application
20+
CMD ["npm", "start"]

‎sample_files/sample.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<title>Sample HTML Page</title>
7+
</head>
8+
9+
<body>
10+
<h1>Welcome to the Sample HTML Page</h1>
11+
<p>This is a simple HTML file for demonstration purposes.</p>
12+
<ul>
13+
<li>First item</li>
14+
<li>Second item</li>
15+
<li>Third item</li>
16+
</ul>
17+
</body>
18+
19+
</html>

‎sample_files/sample.xml‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<library>
3+
<book id="1">
4+
<title>Introduction to XML</title>
5+
<author>Jane Doe</author>
6+
<year>2022</year>
7+
<genre>Technology</genre>
8+
</book>
9+
<book id="2">
10+
<title>Learning React</title>
11+
<author>John Smith</author>
12+
<year>2023</year>
13+
<genre>Programming</genre>
14+
</book>
15+
</library>

‎sample_files/sample1.tsx‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
function Foo(props: { name: string }) {
2+
return <div>{props.name}</div>
3+
4+
}
5+
6+
export function Demo() {
7+
return <div>
8+
<Foo name="bar" />
9+
Hello world!
10+
</div>
11+
}

0 commit comments

Comments
 (0)