Use latest p5/p5.sound in textarea

Author: davepagurek

client/modules/IDE/components/Preferences/index.jsx

@@ -19,7 +19,7 @@ import {
   setLinewrap,
   setPreferencesTab
 } from '../../actions/preferences';
-import { p5SoundURL, useP5Version } from '../../hooks/useP5Version';
+import { p5SoundURL, p5URL, useP5Version } from '../../hooks/useP5Version';
 import VersionPicker from '../VersionPicker';
 import { updateFileContent } from '../../actions/files';
 import { CmControllerContext } from '../../pages/IDEView';
@@ -521,8 +521,8 @@ export default function Preferences() {
                 <TextArea
                   className="preference__textarea"
                   src={
-                    '<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.7.0/p5.js"></script>\n' +
-                    '<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.7.0/addons/p5.sound.min.js"></script>'
+                    `<script src="${p5URL}"></script>\n` +
+                    `<script src="${p5SoundURL}"></script>`
                   }
                 />
               </div>

client/modules/IDE/hooks/useP5Version.jsx

@@ -138,6 +138,7 @@ export const currentP5Version = p5Versions[0];
 export const p5SoundURL = `https://cdnjs.cloudflare.com/ajax/libs/p5.js/${currentP5Version}/addons/p5.sound.min.js`;
 export const p5PreloadAddonURL = 'https://TODO/preload.js';
 export const p5ShapesAddonURL = 'https://TODO/shapes.js';
+export const p5URL = `https://cdnjs.cloudflare.com/ajax/libs/p5.js/${currentP5Version}/p5.js`;
 
 const P5VersionContext = React.createContext({});