feat: Display a preset compatibility note for each online preset.

src/App.tsx

@@ -3,7 +3,11 @@ import TopBar from "./components/TopBar";
 import SceneSelector from "./components/SceneSelector";
 import Scene from "./scenes/Scene";
 import { HashRouter as Router } from "react-router-dom";
-import SysInfoContext, { createMachineSignature, SysInfoState } from "./contexts/SysInfoContext";
+import SysInfoContext, {
+  createMachineSignature,
+  SysInfoState,
+  createPermissiveMachineSignature,
+} from "./contexts/SysInfoContext";
 import LightModeContext from "./contexts/LightModeContext";
 import { checkNewVersion } from "./contexts/RyzenControllerAppContext";
 import LocaleContext, { getTranslation } from "./contexts/LocaleContext";
@@ -34,6 +38,7 @@ class App extends React.Component<{}, AppState> {
     system: false,
     bios: false,
     signature: false,
+    permissiveSignature: false,
   };
 
   state = {
@@ -79,6 +84,7 @@ class App extends React.Component<{}, AppState> {
     si.getAllData()
       .then((data: SysInfoState) => {
         data.signature = createMachineSignature(data);
+        data.permissiveSignature = createPermissiveMachineSignature(data);
         this._isMounted && this.setState({ sysinfo: data });
       })
       .catch((error: string) => {

src/components/PresetButtons.tsx

@@ -51,7 +51,11 @@ class PresetButtons extends React.Component<PresetButtonsProps, {}> {
                     {(presetsOnlineContext: PresetsOnlineContextType) => (
                       <button
                         className="uk-button uk-button-small uk-button-default"
-                        onClick={this.uploadPreset(presetsOnlineContext, sysinfo.signature)}
+                        onClick={this.uploadPreset(
+                          presetsOnlineContext,
+                          sysinfo.signature,
+                          sysinfo.permissiveSignature
+                        )}
                       >
                         {getTranslation("presetButtons.upload", "Upload")}
                       </button>
@@ -77,17 +81,21 @@ class PresetButtons extends React.Component<PresetButtonsProps, {}> {
 
   uploadPreset(
     presetsOnlineContext: PresetsOnlineContextType,
-    signature: string | false
+    signature: string | false,
+    permissiveSignature: string | false
   ): (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void {
     return () => {
-      if (!signature) {
+      if (!signature || !permissiveSignature) {
         NotificationContext.warning(
           getTranslation("presetButtons.mustWaitForSignatureGen", "You must wait for laptop signature to be generated")
         );
         return;
       }
-      let presetsWithSameName = presetsOnlineContext.list.filter(preset => {
+      let presetsWithSameName = presetsOnlineContext.list.filter((preset: ApiPreset) => {
-        return preset.name === this.props.presetName && preset.systemHash === signature;
+        return (
+          preset.name === this.props.presetName &&
+          (preset.systemHash === signature || preset.permissiveSystemHash === permissiveSignature)
+        );
       });
       if (presetsWithSameName.length > 0) {
         NotificationContext.warning(
@@ -110,6 +118,7 @@ class PresetButtons extends React.Component<PresetButtonsProps, {}> {
             .uploadPreset({
               name: this.props.presetName,
               systemHash: signature,
+              permissiveSystemHash: permissiveSignature,
               ryzenAdjArguments: this.props.preset,
             })
             .then(value => {

src/components/PresetOnline.tsx

@@ -12,14 +12,17 @@ function PresetOnline() {
       {(sysInfoContext: SysInfoState) => (
         <PresetsOnlineContext.Consumer>
           {(presetsOnlineContext: PresetsOnlineContextType) => {
-            return presetsOnlineContext.list
+            const compatPresetList = presetsOnlineContext.list
               .filter(preset => isPresetValid(preset.ryzenAdjArguments))
-              .filter(preset => preset.systemHash === sysInfoContext.signature).length && sysInfoContext?.signature ? (
+              .filter(
+                preset =>
+                  preset.permissiveSystemHash === sysInfoContext.permissiveSignature ||
+                  preset.systemHash === sysInfoContext.signature
+              );
+
+            return compatPresetList.length && sysInfoContext?.signature ? (
               <ul className="uk-margin uk-list uk-list-large uk-list-striped">
-                {presetsOnlineContext.list
+                {compatPresetList.map((preset: ApiPreset, index) => {
-                  .filter(preset => isPresetValid(preset.ryzenAdjArguments))
-                  .filter(preset => preset.systemHash === sysInfoContext.signature)
-                  .map((preset: ApiPreset, index) => {
                   const presetName = preset.name;
                   return <PresetOnlineLine preset={preset} key={`online_${index}_${presetName}_btn`} />;
                 })}
@@ -35,7 +38,7 @@ function PresetOnline() {
                   {getTranslation("PresetOnline.retryLoadingPresetListBtn", "Retry")}
                 </button>
               </Card>
-            ) : presetsOnlineContext.loading || !sysInfoContext?.signature ? (
+            ) : presetsOnlineContext.loading || !sysInfoContext?.signature || !sysInfoContext?.permissiveSignature ? (
               <div className="uk-flex uk-flex-center">
                 <div uk-spinner="ratio: 2"></div>
               </div>

src/components/PresetOnlineLine.tsx

@@ -1,6 +1,10 @@
 import * as React from "react";
 import PresetSummary from "../components/PresetSummary";
 import PresetOnlineButtons from "../components/PresetOnlineButtons";
+import SysInfoContext, { SysInfoState } from "../contexts/SysInfoContext";
+import { getTranslation } from "../contexts/LocaleContext";
+
+const compatSentence = getTranslation("presetLine.compatibility", "Compatibility level:");
 
 type PresetOnlineLineProps = {
   preset: ApiPreset;
@@ -24,6 +28,22 @@ class PresetOnlineLine extends React.PureComponent<PresetOnlineLineProps, {}> {
               downvote={this.props.preset.downvote}
             />
           </div>
+          <SysInfoContext.Consumer>
+            {(sysInfo: SysInfoState) => {
+              var compatLevel = 1;
+              if (sysInfo.permissiveSignature === this.props.preset.permissiveSystemHash) {
+                compatLevel = 2;
+              }
+              if (sysInfo.signature === this.props.preset.systemHash) {
+                compatLevel = 3;
+              }
+              return (
+                <div className="uk-width-1-1">
+                  {compatSentence} {compatLevel}/3
+                </div>
+              );
+            }}
+          </SysInfoContext.Consumer>
         </div>
       </li>
     );

src/contexts/SysInfoContext.tsx

@@ -11,6 +11,7 @@ export type SysInfoState = {
   system: Systeminformation.SystemData | false;
   bios: Systeminformation.BiosData | false;
   signature: string | false;
+  permissiveSignature: string | false;
   error?: string;
 };
 
@@ -36,6 +37,20 @@ const createMachineSignature = function(data: SysInfoState): string | false {
   });
 };
 
+const createPermissiveMachineSignature = function(data: SysInfoState): string | false {
+  if (data.error) {
+    return false;
+  }
+  if (data.system === false || data.graphics === false) {
+    return false;
+  }
+
+  return hasher({
+    "system.manufacturer": data.system.manufacturer,
+    "system.model": data.system.model,
+  });
+};
+
 let context: SysInfoState = {
   cpu: false,
   graphics: false,
@@ -44,10 +59,11 @@ let context: SysInfoState = {
   system: false,
   bios: false,
   signature: false,
+  permissiveSignature: false,
 };
 
 const SysInfoContext = createContext(context);
 SysInfoContext.displayName = "SysInfoContext";
 
 export default SysInfoContext;
-export { createMachineSignature };
+export { createMachineSignature, createPermissiveMachineSignature };

src/locales/ch.json

@@ -105,5 +105,6 @@
   "PresetOnline.errorLoadingPresets": "无法加载预设。",
   "PresetOnline.retryLoadingPresetListBtn": "重试",
   "PresetOnline.pleaseCheckInternetConnection": "请检查您的互联网连接。",
-  "presetButtons.uploadError": "上载预设时发生错误"
+  "presetButtons.uploadError": "上载预设时发生错误",
+  "presetLine.compatibility": "兼容性:"
 }

src/locales/de.json

@@ -105,5 +105,6 @@
   "PresetOnline.errorLoadingPresets": "Presets können nicht geladen werden.",
   "PresetOnline.retryLoadingPresetListBtn": "Wiederholen",
   "PresetOnline.pleaseCheckInternetConnection": "Bitte überprüfe deine Internetverbindung.",
-  "presetButtons.uploadError": "Beim Hochladen der Voreinstellung ist ein Fehler aufgetreten"
+  "presetButtons.uploadError": "Beim Hochladen der Voreinstellung ist ein Fehler aufgetreten",
+  "presetLine.compatibility": "Kompatibilität:"
 }

src/locales/en.json

@@ -105,5 +105,6 @@
   "PresetOnline.errorLoadingPresets": "Unable to load presets.",
   "PresetOnline.retryLoadingPresetListBtn": "Retry",
   "PresetOnline.pleaseCheckInternetConnection": "Please check your internet connection.",
-  "presetButtons.uploadError": "An error occured while uploading the preset"
+  "presetButtons.uploadError": "An error occured while uploading the preset",
+  "presetLine.compatibility": "Compatibility:"
 }

src/locales/fr.json

@@ -105,5 +105,6 @@
   "PresetOnline.errorLoadingPresets": "Impossible de charger les presets en ligne.",
   "PresetOnline.retryLoadingPresetListBtn": "Réessayer",
   "PresetOnline.pleaseCheckInternetConnection": "Veuillez vérifier votre connexion internet.",
-  "presetButtons.uploadError": "Une erreur est survenu lors de l'upload du preset"
+  "presetButtons.uploadError": "Une erreur est survenu lors de l'upload du preset",
+  "presetLine.compatibility": "Compatibilité :"
 }

src/locales/tr.json

@@ -105,5 +105,6 @@
   "PresetOnline.errorLoadingPresets": "Ön ayarlar yüklenemiyor.",
   "PresetOnline.retryLoadingPresetListBtn": "Yeniden Dene",
   "PresetOnline.pleaseCheckInternetConnection": "Lütfen internet bağlantınızı kontrol edin.",
-  "presetButtons.uploadError": "Ön ayar yüklenirken bir hata oluştu"
+  "presetButtons.uploadError": "Ön ayar yüklenirken bir hata oluştu",
+  "presetLine.compatibility": "bağdaşma:"
 }

src/react-app-env.d.ts

@@ -107,6 +107,7 @@ type RyzenControllerAppContextType = {
 type ApiPreset = {
   id: number;
   systemHash: string;
+  permissiveSystemHash: string;
   upvote: number;
   downvote: number;
   name: string;

src/scenes/SettingsScene.tsx

@@ -25,7 +25,10 @@ class SettingsScene extends React.PureComponent<{}, {}> {
                 "This will be used to ensure downloaded presets compatibility."
               )}`}
             >
-              System hash: {sysInfoContext.signature || getTranslation("SettingsScene.loadingSysHash", "Loading...")}
+              System hash:{" "}
+              {sysInfoContext.signature && sysInfoContext.permissiveSignature
+                ? `${sysInfoContext.signature} || ${sysInfoContext.permissiveSignature}`
+                : getTranslation("SettingsScene.loadingSysHash", "Loading...")}
             </p>
           )}
         </SysInfoContext.Consumer>