Merge pull request #83 from xsnippet/raw-snippet-url

Set proper links (hrefs) for "raw" snippet button

Author: ikalnytskyi

src/components/RecentSnippetItem.jsx

@@ -10,6 +10,7 @@ const RecentSnippetItem = ({ snippet }) => {
   const syntax = mode.caption;
   const snippetTitle = snippet.get('title') || `#${snippet.get('id')}, Untitled`;
   const download = () => downloadSnippet(snippet);
+  const rawUrl = process.env.RAW_SNIPPETS_URL_FORMAT.replace('%s', snippet.get('id'));
 
   return (
     <li className="recent-snippet-item">
@@ -25,7 +26,7 @@ const RecentSnippetItem = ({ snippet }) => {
       <div className="recent-snippet-actions">
         <span className="recent-snippet-lang">{syntax}</span>
         <div>
-          <button className="recent-snippet-button light">Raw</button>
+          <a href={rawUrl} className="recent-snippet-button light">Raw</a>
           <button className="recent-snippet-button light" onClick={download}>Download</button>
           <Link to={`${snippet.get('id')}`} className="recent-snippet-button">Show</Link>
         </div>

src/components/Snippet.jsx

@@ -51,6 +51,7 @@ class Snippet extends React.Component {
     const snippetTitle = snippet.get('title') || `#${snippet.get('id')}, Untitled`;
     const mode = modesByName[snippet.get('syntax')] || modesByName.text;
     const syntax = mode.caption;
+    const rawUrl = process.env.RAW_SNIPPETS_URL_FORMAT.replace('%s', snippet.get('id'));
 
     return (
       [
@@ -67,7 +68,7 @@ class Snippet extends React.Component {
             <div className="snippet-data-actions">
               <span className="snippet-data-lang">{syntax}</span>
               <div>
-                <button className="snippet-button">Raw</button>
+                <a href={rawUrl} className="snippet-button">Raw</a>
                 <button className="snippet-button" onClick={this.download}>Download</button>
                 <button
                   className={`snippet-button ${this.state.isShowEmbed}`}

src/styles/Snippet.styl

@@ -68,6 +68,7 @@ button-group-width = 312px
     background-color: button-active
     text-transform: uppercase
     cursor: pointer
+    text-decoration: none
     &:last-child
       margin-right: 0
     &.true

webpack.config.js

@@ -205,7 +205,10 @@ module.exports = () => {
       // testing to make debugging easier. We do not know which default they
       // use, so let's set 'production' explicitly and let user to override
       // this value.
-      new webpack.EnvironmentPlugin({ NODE_ENV: 'production' }),
+      new webpack.EnvironmentPlugin({
+        NODE_ENV: 'production',
+        RAW_SNIPPETS_URL_FORMAT: '//xsnippet.org/%s/raw',
+      }),
 
       // Generate index.html based on passed template, populating it with
       // produced JavaScript bundles.