RSS: Use canonical_url (with ':') instead of slicing to 2 characters.

## Changes
- Change to canonical_url (with ':').
- The old format of 'claimName/claimId' needs to be supported still, since we shipped with it.

## Notes
- It would be nice to use regex instead of 2 separate paths, but I couldn't figure out how to make the koa variables work.

ui/component/claimMenuList/view.jsx

@@ -103,7 +103,7 @@ function ClaimMenuList(props: Props) {
   }
 
   const shareUrl: string = generateShareUrl(SHARE_DOMAIN, uri);
-  const rssUrl: string = isChannel ? generateRssUrl(URL, uri) : '';
+  const rssUrl: string = isChannel ? generateRssUrl(URL, claim) : '';
   const isCollectionClaim = claim && claim.value_type === 'collection';
   // $FlowFixMe
   const isPlayable =
@@ -369,7 +369,7 @@ function ClaimMenuList(props: Props) {
 
         <hr className="menu__separator" />
 
-        {isChannelPage && IS_WEB && (
+        {isChannelPage && IS_WEB && rssUrl && (
           <MenuItem className="comment__menu-option" onSelect={handleCopyRssLink}>
             <div className="menu__link">
               <Icon aria-hidden icon={ICONS.RSS} />

ui/util/url.js

@@ -148,8 +148,11 @@ export const generateShareUrl = (
   return url;
 };
 
-export const generateRssUrl = (domain, lbryUrl) => {
-  const { channelName, channelClaimId } = parseURI(lbryUrl);
-  const url = `${domain}/$/rss/@${channelName}${channelClaimId ? `/${channelClaimId.slice(0, 2)}` : ''}`;
+export const generateRssUrl = (domain, channelClaim) => {
+  if (!channelClaim || channelClaim.value_type !== 'channel' || !channelClaim.canonical_url) {
+    return '';
+  }
+
+  const url = `${domain}/$/rss/${channelClaim.canonical_url.replace('lbry://', '').replace('#', ':')}`;
   return url;
 };

web/src/routes.js

@@ -18,6 +18,12 @@ function getStreamUrl(ctx) {
   return streamUrl;
 }
 
+const rssMiddleware = async (ctx) => {
+  const xml = await getRss(ctx);
+  ctx.set('Content-Type', 'application/rss+xml');
+  ctx.body = xml;
+};
+
 router.get(`/$/api/content/get`, async (ctx) => {
   let content;
   try {
@@ -43,11 +49,8 @@ router.get(`/$/stream/:claimName/:claimId`, async (ctx) => {
   ctx.redirect(streamUrl);
 });
 
-router.get(`/$/rss/:claimName/:claimId`, async (ctx) => {
-  const xml = await getRss(ctx);
-  ctx.set('Content-Type', 'application/rss+xml');
-  ctx.body = xml;
-});
+router.get(`/$/rss/:claimName/:claimId`, rssMiddleware);
+router.get(`/$/rss/:claimName::claimId`, rssMiddleware);
 
 router.get('*', async (ctx) => {
   const html = await getHtml(ctx);

web/src/rss.js

@@ -108,7 +108,7 @@ async function getRss(ctx) {
     return channelClaim;
   }
 
-  const feed = await getFeed(channelClaim, `${URL}/$/rss/${ctx.params.claimName}/${ctx.params.claimId}`);
+  const feed = await getFeed(channelClaim, `${URL}${ctx.request.url}`);
   return postProcess(feed.rss2());
 }